пользовательский стиль для формы WHMCS входа в WP

Question

Я хочу дать свой стиль для WHMCS интеграции Логиниться, которая

<form method="post" action="https://www.xxxxx.com/secure/dologin.php"> Email Address: <input type="text" name="username" size="50" /><br /> Password: <input type="password" name="password" size="20" /><br /> <input type="submit" value="Login" /> </form> 

Однако я хочу, чтобы стиль форму, как это:

<form class="pure-form"> 
    <fieldset> 
     <legend>A compact inline form</legend> 

     <input type="email" placeholder="Email"> 
     <input type="password" placeholder="Password"> 

     <label for="remember"> 
      <input id="remember" type="checkbox"> Remember me 
     </label> 

     <button type="submit" class="pure-button pure-button-primary">Sign in</button> 
    </fieldset> 
</form> 

который доступна на http://purecss.io/forms/

у меня есть часть для HTML код для вставки, Java Script, и пользовательский стиль CSS

Пожалуйста, может кто-то помочь, как я могу иметь возможность стилизовать форму как Pure.css

Answer 1

Вы можете выполнить следующие шаги, чтобы создать пользовательскую страницу входа в систему для Wordpress:

Шаг 1: Создать шаблон и добавить ниже коды в этой странице -

<?php 
if (! is_user_logged_in()) { // Display WordPress login form: 
    $args = array(
     'redirect' => admin_url(), 
     'form_id' => 'loginform-custom', 
     'label_username' => __('Username custom text'), 
     'label_password' => __('Password custom text'), 
     'label_remember' => __('Remember Me custom text'), 
     'label_log_in' => __('Log In custom text'), 
     'remember' => true 
    ); 
    wp_login_form($args); 
} else { // If logged in: 
    wp_loginout(home_url()); // Display "Log Out" link. 
    echo " | "; 
    wp_register('', ''); // Display "Site Admin" link. 
} 
?> 

Шаг 2: Создать новую страницу в WP фонового и назначить выше созданный шаблон на этой странице.

Шаг 3: Включите CSS и JS файлы с помощью сор Епдиеего сценария крючка либо в functions.php или сам шаблоне

Вы можете изменить ID и классы в HTML в соответствии в рассуждениях вы выбор список.