Customize Login Page

You know, the one typically at These are things you would put in the active theme's functions.php file.

Change the Logo

Is the WordPress logo by default, this changes the file path of that image. Change file path and file name to your own needs.

function custom_login_logo() {
	echo '<style type="text/css">h1 a { background: url('.get_bloginfo('template_directory').'/images/logo-login.gif) 50% 50% no-repeat !important; }</style>';
add_action('login_head', 'custom_login_logo');

Change the URL

... of where clicking that logo goes. By default it goes to, this will change it to your own homepage.

function change_wp_login_url() {
	return bloginfo('url');
add_filter('login_headerurl', 'change_wp_login_url');

Change the Title

That is, change the title attribute of the image you just replaced. This changes it to the name of your blog in the settings.

function change_wp_login_title() {
	return get_option('blogname');
add_filter('login_headertitle', 'change_wp_login_title');


  1. Jim
    Permalink to comment#

    Also helpful is replacing the dashboard logo:

    <style type=”text/css”>
      #header-logo { background-image: url(‘.get_bloginfo(‘template_directory’).’/img/dashboardlogo.gif) !important; }

    Related question: if using a child theme, how to reference THAT directory? template_directory references the parent theme. thanks!

  2. Kaushik Biswas
    Permalink to comment#

    Hm! Very helpful for me. Thanks, I was looking for this easy way to change the login page in my personal blog.

  3. Tino1408
    Permalink to comment#

    Umm am a noob at this but do you place it any where like all the way at the bottom of the function.php or dose it have to be in the middle?

  4. Tino1408
    Permalink to comment#

    Also can i have an example on where to place it. I think that will help alot. Thanks

  5. wptidbits
    Permalink to comment#

    I believe it does not matter where you put it whether in the middle or at the end of functions.php. Just make sure at the most end of the code in functions.php file, it got no space at all.

    For example if the final line is …’change_wp_login_title’); Make sure you press delete button after the “;” until no space left.

    Mostly functions.php will not work and giving error functions when this feature is called during page loading. Just my two cents.

  6. Michael Gunner

    If you want to change the CSS of the whole page use:

    function custom_login() { 
      echo '<link rel="stylesheet" type="text/css" href="'.get_bloginfo('template_directory').'" /<'; 
  7. amy marie adams

    wordpress has a popular plug-in that works great & simple to use that will do all of the above and more for you

    it is wp total hacks

    • piku2008

      This plugin will help me a lot with all my future projects ….


    • Ablay
      Permalink to comment#

      Plugins are very heavy, and they are slowing down page speed.

  8. Michael Gunner
    Permalink to comment#

    I prefer doing the “hacks” myself. I like to be in control.

  9. Hassan

    On change_wp_login_url and change_wp_login_title functions, you should return the data instead of echoing it out. Because echo will output it directly to the browser, while returning the data ensures that other plugins can still hook to your output and modify the result.
    When using Filter Hooks you should return the result.

  10. Rajesh Namase
    Permalink to comment#

    Great tips, really useful. I am using it for my blog. Thanks :)

  11. Unai
    Permalink to comment#

    Can anyone tell me how to do the same with the ‘login out’ confirmation page?

    Thanks (:

  12. Cam Collins
    Permalink to comment#

    This post was very helpful, however I needed to change my login logo using a custom child theme. I used the get_stylesheet_directory_uri which returns the web address of the directory your child theme (e.g. style.css):

    function my_login_head() {
    	echo "
    	body.login #login h1 a {
    		background: url('".get_stylesheet_directory_uri()."/images/your-logo.png') no-repeat scroll center top transparent;
    		height: 70px;
    		width: 285px;
    add_action('login_head', 'my_login_head');
  13. Acedia
    Permalink to comment#

    great I’ll try this

  14. Anthony
    Permalink to comment#

    As of 3.4 you need to return instead of echo.

    function change_wp_login_url() {
      return get_home_url();
  15. Wordpress Chef
    Permalink to comment#

    Another functional way to customize your WP login page is to use custom CSS file. This can be achieved with following code.

    function custom_login() {
      echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('template_directory') . '" />'; 
    add_action('login_head', 'custom_login');


  16. Alex
    Permalink to comment#

    Hey, there is a small error in the link replacement, you are supposed to use return get_bloginfo( 'url' ); not echo bloginfo('url');

  17. alicia
    Permalink to comment#

    where exactly in the functions.php file are you inserting this code? I keep getting errors.

  18. Mark
    Permalink to comment#

    Couldn’t get changing the link to work until I followed Alex’s advice:
    return get_bloginfo( 'home_url' );

  19. jasa pembuatan web
    Permalink to comment#

    Did this work is still in accordance with the latest wordpress update (3.9)?
    Because I see you publishing date is 2013
    Please reply
    thank you

  20. Ryan
    Permalink to comment#

    I can go one better than this and create a custom login form directly on the home page without ever having to go near wp-admin:

    $args = array(
        'redirect' => home_url(), // The link to redirect to after logging in, can also be admin_url().
        'form_id' => 'custom-login-form-id', // id of form
        'label_username' => __( 'Username' ), // Custom username text
        'label_password' => __( 'Password' ), // Custom password text
        'label_remember' => __( 'Remember Me' ), // Custom remember me text
        'label_log_in' => __( 'Log In' ), // Text for the login button
        'remember' => false 
    wp_login_form( $args ); // Displays the login.
  21. Avtar
    Permalink to comment#

    Hey.. I just wanted to change logo in my twenty fifteen theme. When put that code in function.Php … WordPress logo disappears but my new logo doesn’t appear.. Please help me.

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences like this:

  function example() {
    element.innerHTML = "<div>code</div>";

We have a pretty good* newsletter.