Ticker

6/recent/ticker-posts

Ad Code

Responsive Advertisement

How to easily change WordPress Login page Logo and URL?

New updated Login page logo and URL.

Here is a Login Page default WordPress logo:

Default Login page logo and URL.

By default every WordPress page has default logo and WordPress.org URL. Just incase if you want to change WordPress default login URL and Logo then you are at right place.

Let’s get started:

Step-1: Change Login Page URL

We will use

login_headerurl WordPress hook to change URL link. It is used to filter the URL of the logo on the WordPress login page. By default, this logo links to the WordPress site.

Put below code into functions.php file.

// The “login_headerurl” filter is used to filter the URL of the logo on the WordPress login page. 
// By default, this logo links to the WordPress site.
add_filter('login_headerurl','crunchify_login_link');
function crunchify_login_link() {

        // Change Logo link if you want user to redirect to other link.
        return home_url();
}

Step-2. Change Login Page Logo

We will use

login_enqueue_scripts WordPress hook. It is the proper hook to use when enqueuing items that are meant to appear on the login page. Despite the name, it is used for enqueuing both scripts and styles.

Put below code into functions.php file.

// login_enqueue_scripts is the proper hook to use when enqueuing items that are meant to appear on the login page. 
// Despite the name, it is used for enqueuing both scripts and styles.
add_action( 'login_enqueue_scripts', 'crunchify_change_login_logo' );
function crunchify_change_login_logo() { ?>
    <style type="text/css">
        #login {
                width: 400px;
        }
        
        #login h1 {
                background: transparent;
                padding: 10px;
        }
        
        #login h1 a {
                background: url('https://cdn.crunchify.com/crunchify-logo.png') no-repeat center center;
                background-size: 200px;
                height: 200px;
                margin: 0 auto;
                width: 200px;
        }
        
        .login form .input,
        .login input[type="text"] {
                font-size: 20px;
                font-weight: 100;
                margin: 3px 7px 17px 0;
                padding: 6px 12px;
        }
                
        input[type="checkbox"]:focus,
        input[type="color"]:focus,
        input[type="date"]:focus,
        input[type="datetime-local"]:focus,
        input[type="datetime"]:focus,
        input[type="email"]:focus,
        input[type="month"]:focus,
        input[type="number"]:focus,
        input[type="password"]:focus,
        input[type="radio"]:focus,
        input[type="search"]:focus,
        input[type="tel"]:focus,
        input[type="text"]:focus,
        input[type="time"]:focus,
        input[type="url"]:focus,
        input[type="week"]:focus,
        select:focus,
        textarea:focus {
                border: 2px solid #ddd;
                box-shadow: 0 0 3px rgba(0, 0, 0, .3);
        }
        
        .wp-core-ui .button-group.button-large .button,
        .wp-core-ui .button.button-large {
                background: #b11f24;
                border: 0;
                border-radius: 0;
                box-shadow: none;
                font-weight: 400;
                height: 20px;
                line-height: 30px;
                padding: 2px 14px 4px;
                text-shadow: none;
                text-transform: uppercase;
        }
        
        .login #backtoblog a:hover,
        .login #nav a:hover,
        .login h1 a:hover {
                color: #b11f24;
        }
        
        .login .message {
                border-left-color: #ddd;
        }
        
        input[type="checkbox"],
        input[type="color"],
        input[type="date"],
        input[type="datetime-local"],
        input[type="datetime"],
        input[type="email"],
        input[type="month"],
        input[type="number"],
        input[type="password"],
        input[type="radio"],
        input[type="search"],
        input[type="tel"],
        input[type="text"],
        input[type="time"],
        input[type="url"],
        input[type="week"],
        select,
        textarea {
                border: 2px solid #ccc;
        }
        
    </style>
<?php }

Just save all changes and go to your site’s login page. It should look like this: https://ift.tt/3C8ePHt

That’s it. Congratulations. You have successfully updated Login page Logo and URL. Let me know if you face any issue running this code.

The post How to easily change WordPress Login page Logo and URL? appeared first on Crunchify.

Enregistrer un commentaire

0 Commentaires