How to make logo centered with Register Plus WordPress plugin

I love the WordPress Register Plus plugin programmed by Skullbit, the only issue I have with the plugin though is that my uploaded logo isn’t completely centered on the log in and register page (wp-login). So I decided to dig into the code and find out what the issue was.

It is a very simple css goof up. Basically, any time you are dealing with block elements in css, you need to know that they take up the full length available to them. With the Register Plus plugin the author, which I’m very impressed with the work this web developer has  done, attempted to aligned the h1 element using the css command:

background-position:center top;

When instead, you can simply center the h1 block element by removing that command and adding this one:

margin-left:auto;
margin-right:auto;

Let me show you how you can fix this bug from the comfort of your WordPress back office.

Once you are logged into WordPress, go to Plugins, then click on Editor. Find the Register Plus plugin from the select drop down. The first php file should be already selected (register-plus/register-plus.php) Now scroll down towards the bottom, this  is a pretty lengthy file, search for this code:

<style type="text/css">
#login h1 a {
background-image: url(<?php echo $regplus['logo'];?>);
background-position:center top;
width: <?php echo $width; ?>px;
min-width:292px;
height: <?php echo $height; ?>px;
}

Now replace:

background-position:center top;

with

margin-left:auto;
margin-right:auto;

Update the file, then log out. You should now see your image logo nicely centered above the log in page.

Unless the plugin developer fixes this bug in the next update, you’ll have to manually update this every time there is an update with the plugin.

Tags: Block Elements, Centered, Code, CSS, H1, Logo, Plugin Developer, Register Plus, Skullbit, Wordpress Plugin