The login form is a simple html form sending username and password to wp-login.php. This is the simplest way to create a custom login form:
<?php
$redirect_to = '';
?>
<form name="loginform" id="loginform" action="<?php echo site_url( '/wp-login.php' ); ?>" method="post">
<p>Username: <input id="user_login" type="text" size="20" value="" name="log"></p>
<p>Password: <input id="user_pass" type="password" size="20" value="" name="pwd"></p>
<p><input id="rememberme" type="checkbox" value="forever" name="rememberme"></p>
<p><input id="wp-submit" type="submit" value="Login" name="wp-submit"></p>
<input type="hidden" value="<?php echo esc_attr( $redirect_to ); ?>" name="redirect_to">
<input type="hidden" value="1" name="testcookie">
</form>
Line by line:
$redirect_to
: If you want the user redirect to a special page, insert the url here. The url will be inserted in the hidden field at the end of the formular<form ... action="...">
: The data has to be send to wp-login.php. This file is in the root of your WordPress installation. Create the right url withsite_url()
(please refer to the codex for more information aboutsite_url()
). The method has to be set topost
- A input field for the username with id
user_login
- A input field for the password with id
user_pass
- A input field for the ‘RememberMe’ checkbox (optional)
- A submit button
- The hidden field if the user should be redirected after login (optional)
- A hidden field for a testcookie (optional, but usefull)
Create a formular and style it with css. That’s all.