How To Add Logo To WordPress Login Screen

by Ammar Ali on September 25, 2012 · 45 comments

MOST WordPress users don’t customize back end of WordPress like Login Screen!

Am I right? ;)

Of course. Customizing back end of WordPress is a great idea. It will make your blog looks professional!

You may always see a Default WordPress Logo On Your Self Hosted WordPress Login screen. Now you can Customize the logo on the WordPress Login screen by either simply installing a plugin or by adding simple code manually to your theme function.php

I’d recommend you to use manual method because it’s better than using plugin. Plugin can increase number of php calls and can affect your blog!

How To Add Logo To WordPress Login Screen

How To Add Logo To WordPress Login Screen

  1. Go to Dashboard => Appearance =>
  2. Then Click on Editor => Functions.php
  3. Paste the following code in your functions theme file!
function my_custom_login_logo() {
    echo '<style type="text/css">
        h1 a { background-image:url(http://allbloggingtips.com/wp-content/uploads/2012/09/Untitled-4.png) !important; }
    </style>';
}

add_action('login_head', 'my_custom_login_logo');

Now replace http://allbloggingtips.com/wp-content/uploads/2012/09/Untitled-4.png
with your image logo image URL. Make sure its size should be “375 x 70px”

Alternative Method!

If you still face any issue or code not working. Then simply install Login Logo Plugin and see instruction. It’ll works

That’s All. See your blog login screen for changes. Hope you will enjoy the quick tutorial on How To Add Logo To WordPress Login Screen without plugin! :)

If you enjoyed this article, get email updates (it's FREE).

 

Article by

I'm +Ammar Ali Part time Blogger, young Entrepreneur, Affiliate marketer and Student. Read more about me. You can connect with me on Twitter, Facebook.

Ammar has written 123 awesome articles for us.

Recommended Deals

BlueHost- Best WordPress Hosting Best Affordable Theme for WordPress Get Targeted Ranking - First Rank on Google

{ 45 comments… read them below or add one }

1 Harry Sehgal December 27, 2011 at 4:39 pm

Thanks for this. I will try this Plugin.

Reply

2 Ammar Ali December 27, 2011 at 6:26 pm

You must try this plugin. This is so simple.

Reply

3 Suresh Khanal October 1, 2012 at 7:49 pm

Truly a nice share Ammar. I guess adding code in Function.php is better. I was forced to cut off many pluging by HostGator support when my site was running too many process than was allowed. Though the problem was with theme, they won’t look at your theme code unless you have really smaller number of plugins. Its always better to keep it small.

One problem I suspect when you add code in function.php file is that – Won’t it be replaced when you update theme or wordpress? What can be the safeguard in such case?
Suresh Khanal recently posted..Create professional logo for your blog! Yes, You can do it!My Profile

Reply

4 Ammar Ali October 2, 2012 at 8:10 pm

Yeah, It’s better not to use plugin for such simple and quick tutorial! :D

There is no way. You’ve to manually add code to theme so it will add logo to WP Login Screen!!

Reply

5 Kuldeep December 27, 2011 at 7:45 pm

Really Nice update!! Me too will try this for my new blog!!

Reply

6 Ammar Ali December 27, 2011 at 7:50 pm

You must try this. it is so simple to add logo. :P

Reply

7 jzeek September 25, 2012 at 4:33 pm

Wow nice buddy i am going to try this as well…
jzeek recently posted..Nokia unveils Asha 308 and Asha 309My Profile

Reply

8 Khaja moin September 25, 2012 at 5:00 pm

That`s seems very simple!
thanks for sharing Ammar.
Khaja moin recently posted..Alexa Ranking Why Should I Bother? For Money or TrafficMy Profile

Reply

9 Deny Saputra September 25, 2012 at 6:01 pm

Thanks Ali!
Honestly, this is most simple way!
(I salute to every post on your blog, which exactly brings a useful points to the reader)
Keep it up!

Deny
Deny Saputra recently posted..Dos and Don’ts Of Using Doorway Pages To Get Website VisitorsMy Profile

Reply

10 Ammar Ali September 25, 2012 at 7:53 pm

Thank you very much Deny! :)

Reply

11 Mairaj Pirzada September 25, 2012 at 8:13 pm

Whoa!

It worked!
It’s awesome.
Just changed the old logo (I already had one)…
Thanks Ammar… Loved your work.
Mairaj Pirzada recently posted..Generating Post Ideas When You’re Stuck – 21 Ways to Find Ideas!My Profile

Reply

12 sandeep kumar dan September 26, 2012 at 7:33 am

hi, ammar
Its good to customize our login page. I think its gives us feeling as we entered in our own home rather than other.Thanks for sharing… :-)
sandeep kumar dan recently posted..Jobless don’t be hopelessMy Profile

Reply

13 Naveen September 26, 2012 at 3:42 pm

Some times back I’ve tried these method, but not found a good tutorial. Thanks to the detailed tutorial.
Naveen recently posted..Yoast Video SEO Plug-in for WordPress – Optimize Your Videos for Top Search Engine RankingMy Profile

Reply

14 Muhammad Qasim September 27, 2012 at 1:47 am

Good one. Never knew the login page logo is customizable. Using plugin to get this job is best method :)
Muhammad Qasim recently posted..Google Maps for iOS 6 Coming Soon!My Profile

Reply

15 Harley Quinn September 27, 2012 at 2:21 pm

HI Ammar Ali,

Thanks for the cool informative posts, it will be cool if we add logo to our wordpress login and i guess for guest author our blog looks more official by this trick.

Reply

16 Raja Tahir Qaiser September 27, 2012 at 4:51 pm

Used Method # 1
It Works :)
Thanks Ammar for sharing the simplest method for this.

Reply

17 Sean September 27, 2012 at 5:21 pm

Hi, I just came across from another blog where you had commented on and found this as first article I read on your site.

I’ve never thought about customizing the backend and its so simple to do I’ve just found from your posting. Even though on the site I have updated I am running Catalyst it was simple to just goto the functions.php of root theme, change and there you go. Brilliant.

Very useful post which certainly going in my favorites list.
Sean recently posted..How to create an ebook and market itMy Profile

Reply

18 Ammar Ali September 27, 2012 at 7:43 pm

Hello Sean!

Welcome to my blog. ;) I’m glad you liked this post!

Regards.

Reply

19 Linda September 28, 2012 at 12:36 pm

Good one , adding logo to wordpress is an awesome idea , It would attract many users and this can be good way of driving traffic to our site , great and innovative article.
Thanks for sharing

Reply

20 Andrew Walsh September 28, 2012 at 9:53 pm

How would you use this to drive traffic to your site?
Andrew Walsh recently posted..Graduation!My Profile

Reply

21 Andrew Walsh September 28, 2012 at 9:52 pm

Great post Ammar! I had never thought about doing this. It would be especially useful for multi-author blogs in which numerous users log into Wordpress to contribute.
Andrew Walsh recently posted..Graduation!My Profile

Reply

22 Cherryl Vergea September 28, 2012 at 11:11 pm

Hello, thank you for sharing this post. I think adding a logo to wordpress would be brilliant because it would increase the traffic on your website and it would also put a mark on your website. It seems very simple as well so I will definitely be trying it.

Reply

23 tech2fetch September 29, 2012 at 2:20 pm

i have tried this and added my logo thanks for the post
tech2fetch recently posted..Samsung Galaxy S Duos Price in Pakistan And SpecificationsMy Profile

Reply

24 Hussain Saifi September 29, 2012 at 6:58 pm

i successfully change my logo but can i also change link associated with it that was wordpress.org
Hussain Saifi recently posted..Things to avoid that destroy your blogging career?My Profile

Reply

25 Ammar Ali September 29, 2012 at 7:29 pm

I’ll try to find some trick for this! ;)

Reply

26 Sandip Bhagat September 30, 2012 at 3:47 pm

I didn’t know that we can do it like this simple. Thanks for sharing Ammar
Sandip Bhagat recently posted..Giveaway#1 Genesis Generate Child Theme +Framework ($79.95) From StudioPressMy Profile

Reply

27 sreedev September 30, 2012 at 9:45 pm

I have a problem with the logo. My logo appears in a squeezed state. how to solve this? Because of this my login screen is not looking good. Plz help
sreedev recently posted..How To Remove Picture Background in Microsoft PowerPoint 2010My Profile

Reply

28 Ammar Ali October 1, 2012 at 1:44 pm

Make sure image size should be “375 x 70px” If it does not work. You can install Download Fluency Admin Plugin Here :)

Reply

29 Ben Troy October 1, 2012 at 6:34 pm

thanks for this cool tip that works, now we can change the logo easily
Ben Troy recently posted..Free Manual Article Rewrite toolMy Profile

Reply

30 Arjun October 2, 2012 at 9:08 pm

Thanks Ali, Now I have changed my logo in WP login. I used the plugin. It’s fast and easy!
Arjun recently posted..Have Custom Name for Google Plus account [How to]My Profile

Reply

31 Ammar Ali October 3, 2012 at 3:04 pm

Glad to hear that! :D

Reply

32 Ben Troy October 7, 2012 at 5:03 pm

do you know how to implement this tips for thesic skin ?

Reply

33 Ammar Ali October 7, 2012 at 5:14 pm

Are you talking about thesis theme skin? If yes then simple place above code in your custom functions editor / .php file! :)

Reply

34 Ganesh Maharjan October 8, 2012 at 9:54 pm

Wow…! It’s really cool. I’m searching for this since long time. I changed logo of log in page of my blog. I have one questions how to change the link of that logo to my blog instead of wordpress.org ?
waiting for your reply.
Thanks
Ganesh Maharjan recently posted..MCQ of HTML & Web Designing – Set 7My Profile

Reply

35 Ammar Ali October 9, 2012 at 3:19 pm

Right now you can’t do this. However I’ll try to find some trick for this! ;)

Reply

36 Ganesh Maharjan October 9, 2012 at 4:53 pm

I’ll be wait for that trick..!
Ganesh Maharjan recently posted..MCQ of HTML & Web Designing – Set 7My Profile

Reply

37 Kamran ul hassan October 9, 2012 at 1:20 pm

Hi,

Great work Ammar, you share a good tutorial how to change the logo in login page of WordPress, you are a professional blogger and have a good information. i like you way and your information.

Thank
Kamran

Reply

38 Aliakbar Fakhri October 20, 2012 at 12:25 pm

Thanks for this Easiest Tutorial..
your blog posts are helping me constantly..!
:)

Reply

39 JaY Srivastava October 24, 2012 at 10:59 am

Thank God i did it already before.

Reply

40 Khudadad Alam November 18, 2012 at 6:18 pm

Hi Ammar, very good post and thanks for telling this. Before I did not know about this.
Thanks and regards.

Reply

41 Anchit Shethia December 29, 2012 at 12:31 pm

Wow. I have 12 contributors and it would really look professional and interesting to them if i add my logo at the login.
But i am not so experienced with photoshop and stuff.
Do you know any free online tool to make professional loking HD logo?
Anchit Shethia recently posted..How To Read Facebook Chat Messages And Stay UndetectedMy Profile

Reply

42 sean January 1, 2013 at 10:25 pm

Hi, there are two options you have here. Firstly you could use GIMP as this has a set of template logo’s you can use. You simply choose the style and then type your text.

Second option; and for a more professional looking logo; you could take the course here : http://ude.my/brr5u and then go about creating your logo.. Of course there is a cost for that course, although that link is a 51% off so you can take the course for less than half price.

GIMP will give you a basic logo though if want

Reply

43 Suraj Banakar January 20, 2013 at 4:00 pm

Great article!!
Just tried the first method !!
Just added my custom login logo!!!
Thanx for the post!
Keep writing such posts and I would keep on peeping !

Reply

44 Shanta Dsuza March 24, 2013 at 6:21 pm

This was an awesome and effective way to change wordpress log in screen. Following this steps makes a gorgeous look to our log in screen. Thanks :-)
Shanta Dsuza recently posted..How To Start A New Blog And Increase Your EarningsMy Profile

Reply

45 Prajith April 11, 2013 at 10:19 am

works great, thanks.
and in reference to carl’s question – you don’t change the wp image file because when you update wordpress the standard wp logo will come right back.
Prajith recently posted..Quickly Identify Space Hogging files on Android Device With My Device Storage AnalyzerMy Profile

Reply

Leave a Comment

CommentLuv badge

Previous post:

Next post: