Remove the WordPress Version Number with One Simple Code Snippet!
By WPCodeBox
Learn how to quickly change the WordPress logo on the login page using a snippet from WPCodeBox to implement a fast, professional solution.
Tired of seeing the same old WordPress logo every time you or your clients log in? Your login page is often the first impression people get of your website’s backend.
Many guides suggest that you install feature-heavy plugins or make risky edits to your theme files. These methods often lead to plugin bloat, security risks, or site crashes when done incorrectly.
In this article, I’ll share an easy way to change your WordPress login logo safely and quickly, without the usual complications.
All WordPress sites display the same default logo on their login page. When clients, team members, or contributors access your site, they see a generic WordPress logo. This logo appears on millions of other websites, making your site look like just another WordPress installation.
A custom login logo also prevents confusion. Users unfamiliar with WordPress might question whether they’re on the correct site when they see the default logo. This tiny detail can undermine confidence and create doubt about your professional setup.
You might think you need a complex plugin to override core WordPress settings, but the solution is actually quite straightforward. The most efficient way to handle this customization is by using a lightweight code snippet.
This code replaces the default WordPress logo with your custom image while keeping everything else intact. It is safe, tested, and works on any WordPress installation without modifying your core theme files.
To achieve this, this login logo snippet hooks into the login page header and injects a small amount of CSS. This CSS targets the specific container that holds the logo and overrides the background image. It also adjusts the width and background sizing so that the logo looks good on all devices.
function custom_login_logo() {
$logo_url = esc_url( wp_upload_dir()['baseurl'] . '/my-logo.svg');
$css = "#login h1 a {
background: url('{$logo_url}') no-repeat center / contain;
width:auto;
max-width: 320px;
height: 80px;
}";
wp_add_inline_style( 'login', $css );
}
add_action( 'login_enqueue_scripts', 'custom_login_logo');To make this work for your site, you only need to edit one line. First, upload your desired logo (SVG is best for sharpness, but PNG works too) to your Media Library and copy its full file URL.
In the code above, simply replace /my-logo.svg with your copied URL. I have set the background size to contain, which ensures your logo scales perfectly within the container without being cut off, regardless of the device size.
You can add code snippets directly to your theme’s functions.php file, but this approach creates unnecessary risks. One small error can break your entire site, and theme updates will erase your changes. A better solution is to use a code snippet plugin.
WPCodeBox is the best WordPress code snippet plugin that makes adding code safe, organized, and easy to manage. It gives you a clean interface built specifically for WordPress, and you can add HTML, CSS, SCSS, and JS. You copy your snippet, paste it into the editor, and let the plugin handle all the technical details. It saves you from file editing, risk of crashes, and lost work when you update your theme.
Here’s how you can use WPCodeBox to add the snippet:
/my-logo.svg with the actual logo URL.
You can now visit yoursite.com/wp-admin to see your custom logo in place. If you need adjustments, you can edit the snippet and save it again.
Sometimes you need a login page that offers more than just a logo replacement. A completely customizable login page gives you the freedom to style the form, change the background, and move elements exactly where you want them.
Breakdance lets you customize your login page with complete design control. You can use its Login Form widget to build a complete custom login page that matches your brand perfectly. You control the layout, colors, typography, and the logo position. This creates a cohesive experience that extends your brand identity to every corner of your site.
First, ensure Breakdance is installed and activated on your site. Then, create a new page and open it in Breakdance builder. Design the page with all the different elements you want, and then add the Login Form widget to your page. This will automatically generate all the necessary login fields.
Now add an Image element above your form. Upload your custom logo and position it exactly where you want. Breakdance gives you pixel-perfect control over logo size, alignment, and spacing. You can also add background images, custom colors, and branded elements that surround your login form.
Here’s what the custom login form looks like:
The widget also lets you control where users go immediately after they log in. You can specify a redirect URL to send them straight to the default WordPress dashboard or a custom client area.
Even after you’ve created a custom login page, the default WordPress login URL (/wp-login.php) remains active. To ensure everyone lands on your new custom login page, you need to tell WordPress to redirect all traffic from the default login page to your custom one.
Just as we did with the logo, we’ll use WPCodeBox to add this redirection snippet safely.
Create a new snippet in WPCodeBox, set the Type to PHP Snippet, and set the Where to insert the snippet option to Plugins Loaded (Default). Then, paste the following code:
function my_redirect_login_page() {
$login_page = home_url( '/login-url' );
$page_viewed = basename($_SERVER['REQUEST_URI']);
if( $page_viewed == "wp-login.php" && $_SERVER['REQUEST_METHOD'] == 'GET') {
wp_redirect($login_page);
exit;
}
}
add_action('init','my_redirect_login_page');
Remember to replace /login-url with your new custom page slug. Once you enable this snippet, anyone trying to visit the standard WordPress login screen will be automatically redirected to your custom page.
Sometimes you prefer to add code directly to your theme files. This method works without installing additional plugins, but it requires careful attention to avoid errors.
You can add the login logo snippet to your theme’s functions.php file. First, create a child theme to protect your changes from theme updates. Once installed, go to Appearance → Theme File Editor, click I understand on the warning popup, and then click on functions.php.
Paste the snippet at the bottom of the file, after all existing code. Click Update File to save your changes. If you see a white screen or an error message, you’ve likely made a syntax mistake.
Working directly with theme files carries real risks. A missing semicolon or bracket can lock you out of your site. Unlike the snippet plugin, there’s no safety net or error checking. WordPress will attempt to run your code immediately, and any mistakes can break your entire site.
If you encounter issues while editing functions.php, WPDebug Toolkit can help you identify the problem quickly. It’s a WordPress debugging plugin that shows PHP errors in real time and works even when WordPress crashes, helping you spot the exact line causing trouble so you can fix it and regain access to your site.
How do I customize the rest of my WordPress login page?
You can customize the WordPress login page by adding custom CSS to your site’s code. This allows you to replace the logo, update the background color, and style the form. Alternatively, you can use a page builder like Breakdance to design a completely new page and redirect the default login URL to it.
How do I change the link behind the login logo?
Out of the box, clicking the login logo takes you to WordPress.org. Most site owners want this to point to their own homepage. To fix this, you can add a small filter to the same snippet in WPCodeBox:
add_filter( 'login_headerurl', function() {
return home_url();
} );How to change the login page URL in WordPress?
To change the login page URL without adding extra plugins, you can create a redirection. First, create a new page with your desired URL slug, such as /my-login. Then, add a code snippet to your site that detects when someone visits the default wp-login.php address. This code will automatically redirect the user to your new custom URL, ensuring they only access the site through the specific page you created.
