How To Customize WordPress Login Page Background Without Plugin

customize wordpress login page background

Just a couple of days ago, we have published an article to change WordPress login page logo and someone asked to change the background color.

If you want to use any plugin then you can fully customize WordPress login page without HTML/CSS.

You may have visited many websites which allow their users to create an account to participate in their community.

Haven’t you seen a fancy login page?

Well, in this tutorial, you will learn the easiest way to customize WordPress login page background and the background of the login form.

What Are The Required Steps To Change The Colors

If you have a little bit of knowledge about WordPress theme file structure then you would know that functions.php file plays an important role.

All the functions of your theme are managed by this file.

You have to edit this file.

You can edit it from your WordPress admin panel only. Just go to Appearance>>Editor>>functions.php file.

But if you’re not able to login to your WordPress admin panel then you can use the cPanel of your web hosting account.

Go to cPanel>>file manager>>wp-content>>themes>>theme name>>functions.php file.

Open the file and place the code.

function login_background() {
echo ‘<style type=”text/css”>
body { background: #474242; }
.login form { background: #3d2e2e; }
add_action(‘login_head’, ‘login_background’);

This code will totally change the background-color of your login page and the login form.

Let me show you the result.

As you can see, I have used the grayish colors for both the login page and the form.

change background color

You can edit the above-shown code easily.

You can change the name of the function if you want. And if you only want to edit the colors then use the “body” tag to change the color of the whole login page.

Replace the value “#474242” with any other value.

And for the login form, replace the value “#3d2e2e” to anything you want. If you know the CSS language then you won’t face any problem.

I have used the hexadecimal values. You can directly write the name of the color.

Check your login page after editing and boom, you have successfully changed the background colors of your login page and the form.

Isn’t That Easy To Change The Background Color of The Login Page

You can do a lot of changes in the login page.

You would be interested to know that you can also change WordPress login page logo URL, remove password lost link etc.

There are many other things which can be done without any plugin.

Can you now customize WordPress login page background? If you still face any problem, feel free to clear your doubts.

You can also connect with us on Twitter, LinkedIn, and Facebook.

by Ravi Chahar

A WordPress Professional and the LinkedIn Influencer. A coder by passion and a blogger by choice. WordPress theme development is his forte. He is your WordPress guy who will teach you how to solve WordPress errors, WordPress security issues, design issues and what not.

Get Free Updates Into Your Inbox

Learn Everything Just Like I Did


Leave a Reply

Your email address will not be published. Required fields are marked *