3 simple ways to white-label WordPress

WordPress is the most widely used CMS, it’s employed to build countless websites and we can customize it to the max. But sometimes we forget about the admin panel.

Clients love white-label products because they feel bespoke.

So today, we’ll cover three simple ways to customize the WordPress admin panel to make your clients feel that they’re using their own dedicated CMS.

1. Change the login logo

This is a popular hack in the WordPress community. It’s achieved by changing the logo CSS and replacing its background image with our own.

It’s important that the logo you use isn’t larger than 323px by 67px.

Here’s the code you’ll need:

function login_logo() { ?>
<style type="text/css">
        body.login div#login h1 a {
            background-image: url(<?php echo get_bloginfo( 'template_directory' ) ?>/images/logo_login.png);
        }
    
</style>
<?php }

Now that we have the function, we just need to hook it into WordPress using the login enqueue scripts hook:

add_action( 'login_enqueue_scripts', 'login_logo' );

2. Change the dashboard logo

As well as changing the main login logo, we can also change the little ‘W’ at the top of the dashboard. It’s a small change, but clients love it.

The principles of this technique are the same as the principles above, but you have to change the CSS associated with the particular element. The code for this change is a little longer because the logo we’re replacing is part of an image sprite, so we need to alter the background position as well as the image.

It’s important to make your image 20px by 20px.

function dashboard_logo() {?>
<style type="text/css">
#wp-admin-bar-wp-logo > .ab-item .ab-icon { 
	background-image: url(<?php echo get_bloginfo( 'template_directory' ) ?>/images/logo_admin.png) !important; 
	background-position: 0 0;
}
</style>
<?php }

All we need to do now is hook this into WordPress using the admin head hook:

add_action('admin_head', 'dashboard_logo');

3. Change the footer text

This is a really small change, but sometimes the small details are what counts, especially when you need to update the legal text on your admin panel. The original text reads, “Thank you for creating with WordPress.” To change that, you just need three short lines of code:

function admin_footer () {
	echo '© 2014 - Web Designer Depot';
}

Now to hook it into WordPress you just need the admin footer text hook:

add_filter('admin_footer_text', 'admin_footer');

Sara Vieira is a freelance Web Designer and Developer with a passion for HTML5/CSS3 and jQuery. You can follow her on twitter or check out her website. More articles by Sara Vieira
  • Arridesoft

    Thank’s to SARA to share these scripts for doing logo changes in the word press.

  • Respect My Authoritah

    Thank you for this. Can you help with why my login logo is so tiny? I have a 323×67 logo but it’s appearing as 84×84. Also the dashboard logo didn’t change. Thank you.

Home CSS Deals HTML HTML5 Java JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress