Nazmul Ahsan

WordPress Developer, PHP & JavaScript Fan, Open Source Enthusiastic

Skip to content
  • Home
  • বাংলা ব্লগ
  • Contact Me

How to customize WordPress login page

Leave a reply

A beautiful and nicely crafted theme can change the look and feel of your WordPress site. But, what about the login page? Default login page is too ordinary to attract your visitors. Although this can be handled with a custom login page, but most of the themes does not include this feature.
Here I’m going to show you, how can you customize your login page.

1. Disable Shaking effect
Login page shakes if anything wrong happens. For example if the login details provided are wrong or any of the fields is submitted empty. You can override it’s default events. If you want to disable this shaking effect, add this code into functions.php file of your theme.

Disable Shaking effect
PHP
1
2
3
4
function na_shake_error_codes( $shake_error_codes ) {
return array();
}
add_filter( 'shake_error_codes', 'na_shake_error_codes' );

2. Change login header URL
By default, login header image is hyperlinked to http://wordpress.org. If you want to change it to your own, use this code-

Change login header URL
PHP
1
2
3
4
function na_login_header_url( $login_header_url ) {
return 'http://nazmulahsan.me'; // your custom URL here
}
add_filter( 'login_headerurl', 'na_login_header_url' );

3. Change login header image title
By default, it says Powered by WordPress. Use this code to change it to a custom text-

Change login header image title
PHP
1
2
3
4
function na_login_headertitle( $login_header_title ) {
return 'My Site Title'; // your custom title here
}
add_filter( 'login_headertitle', 'na_login_headertitle' );

4. Add new CSS class to body tag
This code snippet will help you-

Add new CSS class to body tag
PHP
1
2
3
4
5
function na_login_body_class( $classes, $action ) {
$classes[] = 'my-new-class';
return $classes;
}
add_filter( 'login_body_class', 'na_login_body_class', 10, 2 );

5. Customize login message
Paste this code into your functions.php to change the texts showing above the login form-

Customize login message
PHP
1
2
3
4
function na_login_message( $message ) {
return 'This is our custom message';
}
add_filter( 'login_message', 'na_login_message' );

6. Change logout redirect URL
By default, it redirects to login page after you log out. This code will change logout redirection to a new URL. Even you can set different URLs for individual user.

Change logout redirect URL
PHP
1
2
3
4
5
6
7
8
9
10
function na_logout_redirect( $redirect_to, $requested_redirect_to, $user ) {
 
// if user ID is 1, then go to homepage
if( 1 == $user->ID ){
return get_bloginfo( 'url' );
}
// otherwise go to default redirect url
return $redirect_to;
}
add_filter( 'logout_redirect', 'na_logout_redirect', 10, 3 );

7. Lost password redirect
Take users to a specific page after they submit lost password form.

Lost password redirect
PHP
1
2
3
4
function na_lostpassword_redirect( $lostpassword_redirect ) {
return get_permalink( 1 ); // go to page with ID 1
}
add_filter( 'lostpassword_redirect', 'na_lostpassword_redirect' );

8. Register redirect
Take users to a specific page after they submit registration form-

Register redirect
PHP
1
2
3
4
function na_register_redirect( $register_redirect ) {
return get_permalink( 1 );
}
add_filter( 'registration_redirect', 'na_register_redirect' );

9. Change login redirect URL
By default, it redirects to wp-admin after you log out. This code will change login redirection to a new URL. Even you can set different URLs for individual user.

Change login redirect URL
PHP
1
2
3
4
5
6
7
8
9
10
function na_login_redirect( $redirect_to, $requested_redirect_to, $user ) {
 
// if user ID is 1, then go to homepage
if( 1 == $user->ID ){
return get_bloginfo( 'url' );
}
// otherwise go to default redirect url
return $redirect_to;
}
add_filter( 'login_redirect', 'na_login_redirect', 10, 3 );

10. Add some meta tag in head tag
Add this code into functions.php file.

Meta tag in login head
PHP
1
2
3
4
function na_login_head() {
echo '<meta name="google-site-verification" content="UA-42226400-1" />';
}
add_action( 'login_head', 'na_login_head' );

11. Add a new stylesheet for login page
Here is your code-

Stylesheet to login page
PHP
1
2
3
4
function na_login_enqueue_scripts() {
wp_enqueue_style( 'na-login', get_stylesheet_directory_uri() . '/login.css' );
}
add_action( 'login_enqueue_scripts', 'na_login_enqueue_scripts' );

12. Add some text after opening body tag.
Paste this code into functions.php

Text in login header
PHP
1
2
3
4
function na_login_header() {
echo 'This is our login page';
}
add_action( 'login_header', 'na_login_header' );

13. Add text to login footer
This code will add This is our login page footer in the footer area of login page.

Add text to login footer
PHP
1
2
3
4
function na_login_footer() {
echo 'This is our login page footer';
}
add_action( 'login_footer', 'na_login_footer' );

14. Add new field in register form
This code will (visually) add a new field for ‘phone number’ in registration form.

New field to register form
PHP
1
2
3
4
5
6
7
8
9
function na_register_form() {
?>
<p>
<label for="user_phone"><?php _e('Phone') ?><br />
<input type="text" name="user_phone" id="user_phone" class="input" size="25" /></label>
</p>
<?php
}
add_action( 'register_form', 'na_register_form' );

Need help with your WordPress tasks?

This entry was posted in WordPress and tagged change login redirect, login, login action hook, login filter hook, login header url, login hook, login page, login page customization, login wordpress on October 29, 2016 by Nazmul Ahsan.

Post navigation

← A simple two-way function to encrypt or decrypt a string Add a ‘Scroll to Top’ button to your WordPress site →

Recent Comments

  • rabiul on A simple two-way function to encrypt or decrypt a string
  • Nazmul Ahsan on A simple two-way function to encrypt or decrypt a string
  • Eberechukwu Iherumadu on A simple two-way function to encrypt or decrypt a string
  • lala on A simple two-way function to encrypt or decrypt a string
  • Ashraful Ash on Transfer large files from one server to another in seconds

Recent Posts

  • How to share logins and user accounts across multiple WordPress sites
  • Ncrypt : A 2-way encryption library for PHP
  • What actually are Hooks in WordPress?
  • How to remove items from +New admin menu?
  • How to handle error messages in PHP
  • Generate activation or deactivation link of WordPress plugin
  • Edit Next Post – my 16th plugin published on the WP repository
  • Add a ‘Scroll to Top’ button to your WordPress site
  • How to customize WordPress login page
  • A simple two-way function to encrypt or decrypt a string
  • Change WordPress password when ‘reset password’ is not working
  • How to stop WordPress from generating multiple image sizes
  • I just released MDC Meta Box – a meta box library for WordPress
  • How to remove default widgets (aka meta boxes) from WordPress dashboard
  • How to clone or add new user roles – WordPress
  • How to rename user roles – WordPress
  • Transfer large files from one server to another in seconds
  • Visitor Counter for WordPress (Hit Counter)
  • Get back to an older version of WordPress (Downgrade WP)
  • Bengali Digits in WordPress
Copyright & Policy Proudly powered by WordPress