Event Manager WordPress プラグインのログインフォームをレスポンシブにした

テンプレートファイルをテーマ・プラグイン・events-managerにコピー

the template file at events-manager/templates/forms/bookingform/login.php

to use templates: http://wp-events-plugin.com/documentation/using-template-files/

eg. wp-content/themes/Your Theme/plugins/events-manager/forms/bookingform/login.php

CODE login.php

<?php

/* 

 * This file generates the default login form within the booking form (if enabled in options).

 */

?>

<div class="em-booking-login">

<form class="em-booking-login-form" action="<?php echo site_url('wp-login.php', 'login_post'); ?>" method="post">

<p><?php esc_html_e('Log in if you already have an account with us.','events-manager'); ?></p>

    <p>

<label><?php esc_html_e( 'Username','events-manager') ?></label>

<input type="text" name="log" class="input" value="" />

</p>

<p>

<label><?php esc_html_e( 'Password','events-manager') ?></label>

<input type="password" name="pwd" class="input" value="" />

    </p>

<div>

     <?php do_action('login_form'); ?>

<input type="submit" name="wp-submit" id="em_wp-submit" value="<?php esc_html_e('Log In', 'events-manager'); ?>" tabindex="100" />

</div>

<p>

<label class="rememberme">

<input name="rememberme" type="checkbox" id="em_rememberme" value="forever" /> <label><?php esc_html_e( 'Remember Me','events-manager') ?></label>

<input type="hidden" name="redirect_to" value="<?php echo esc_url( get_site_url(false, $_SERVER['REQUEST_URI']) ); ?>#em-booking" />

</label>

</P>

<br />

<?php

//Signup Links

if ( get_option('users_can_register') ) {

echo "<br />";  

if ( function_exists('bp_get_signup_page') ) { //Buddypress

$register_link = bp_get_signup_page();

}elseif ( file_exists( ABSPATH."/wp-signup.php" ) ) { //MU + WP3

$register_link = site_url('wp-signup.php', 'login');

} else {

$register_link = site_url('wp-login.php?action=register', 'login');

}

?>

<a href="<?php echo $register_link ?>"><?php esc_html_e('Sign Up','events-manager') ?></a>&nbsp;&nbsp;|&nbsp;&nbsp; 

<?php

}

?>                     

<a href="<?php echo site_url('wp-login.php?action=lostpassword', 'login') ?>" title="<?php esc_html_e('Password Lost and Found', 'events-manager') ?>"><?php esc_html_e('Lost your password?', 'events-manager') ?></a>                        

  </form>

</div>

CSS

 add to customize css area

.em-booking-form label {

    width: 100%;

}

/* em login form responsive */

label.rememberme input{

   margin: 0 5px 0 0;

}

div.em-booking-login label {

    width: 90%;

}

@media screen and (max-width:767px){

div.em-booking-login {

    padding: 10px 10px 10px 10px;

    margin: 0px 0px 0px 0px;

    border-left: none;

    float: left;

}

}

`

ex.

https://wordpress.org/support/topic/login-form-not-responsive-3/