How To: Customize Login Logo on WordPress

You probably have always wanted to get rid of the default WordPress login logo.

Learn how to get a custom WordPress admin login that is branded and customized for you!

Additionally, we are going to give you options to customize the background color of the login page as well. Without further ado, let’s dive in.

In this tutorial, you will need to locate the following files for editing.

What you will need:

  • FileZilla or other file editing program
  • Atom or other text editor program

Files to edit:

  • functions.php
  • site logo in PNG or SVG format.

Caution: while editing the functions.php file is dangerous so proceed with caution. Editing the functions.php file is dangerous and can break your site if you are not careful. Only copy and paste the exact code below and paste at the end of your functions.php before the closing “?>”.

/* = Customize login page
---------------------------------------------------- */

function mgwp_custom_login_logo(){
echo
"<style type='text/css'>
body.login { background-color: #0d1219; }
body.login form { padding-bottom: 24px; }
body.login h1 a { background-image: url(". get_template_directory_uri() ."/lib/images/site-logo-login.png);
background-size: 162px 80px; width: 162px; height: 80px; }
body.login p#backtoblog, body.login p#nav { display: none; }
</style>";
}

function mgwp_custom_login_url(){
return get_option('home');
}

function mgwp_custom_login_title(){
return get_option('blogname');
}

add_action('login_head', 'mgwp_custom_login_logo');
add_filter('login_headerurl', 'mgwp_custom_login_url');
add_filter('login_headertitle', 'mgwp_custom_login_title');


function is_login_page(){
return in_array($GLOBALS['pagenow'], array('wp-login.php', 'wp-register.php'));
}

Examples of WordPress login logo and background color customizations:

Soberton
website link: https://soberton.com/

img-customize-wordpress-login-soberton


Storm Creek
website link: https://stormcreek.com/

img-customize-wordpress-login-storm


M&E Catalyst Group
website link: https://mecatalyst.com/

img-customize-wordpress-login-mecatalyst


Renovo LLCs
https://renovollcs.com/
img-customize-wordpress-login-renovo