Top Nav Bar Categories

How to Add a Favicon to Your WordPress Blog

favicons A-Z
Creative Commons License photo credit: dan taylor

What is a Favicon and Why Should Your Blog Have One?

A favicon is short for “favorite icon.” It is the little image you see in your browser tab next to the name of the website you are viewing. All favicons are the same size: 16×16 pixels. The one for Life Learning Today blog is:

The reason why you want to have one is for branding purposes. People will get to know your favicon and can quickly switch to your site on one of their browser tabs simply by recognizing your favicon. They will also be able to quickly spot it in their list of bookmarks. So now that you see the value in doing this the next step is how to get a favicon image. It’s really easy and free. Here’s how:

How to Create Your own Favicon for Your WordPress Blog

The easiest way is to go to Favicon.cc. Here you can create your favicon in one of 4 ways:

  1. Create one from scratch using their design tool. You fill in each pixel separately with the colors you want. Very easy to use.
  2. Search for one that is already created by typing in search words for the types of images you want.
  3. Customize a favicon that you find through searching. Once you find one you can adjust the colors very easily.
  4. Upload an image and they will convert it to favicon size for you. You can customize that image too.

How to Install a Favicon for Your WordPress Blog

  1. Once you have your favicon image at Favicon.cc then click on “Download Favicon.”
  2. Upload the favicon image via FTP to your webhost. Use the “html” or “public_html” folder.
  3. In your WordPress dashboard click on “Editor” under “Appearance.”
  4. Locate the “header.php” file and edit by adding this code: (make sure your image is named “favicon.ico”)
  5. <linkrel="shortcut icon" href="favicon.ico" >
  6. Save your changes to “header.php.”
  7. Go to your site and do a hard refresh (Ctrl+F5 keys) to see your favicon in your browser tab.

Please Share

Did you like this article? Please see below to print, email, bookmark, or share socially! Thanks!

Subscribe

, , , ,

What do you think? Click any platform below to comment or read other comments.

42 Responses to How to Add a Favicon to Your WordPress Blog

  1. Tickets FC Barcelona February 22, 2010 at 2:53 am #

    A favicon will not drastically change your traffic but it will certainly improve the look of your blog. Adding a unique icon ensures that readers are able to individuate your site inside bookmark lists easily. Tickets FC Barcelona

  2. feld February 22, 2010 at 11:45 pm #

    Thanks for information i got a lot of idea how to optimize my blogs.

  3. feld February 22, 2010 at 11:47 pm #

    Icon is very attractive to the viewer and you can easily emphasize the functions.

  4. Fabio February 25, 2010 at 8:58 am #

    Thank you for this post,

    I will replace the actual icons with the new Favicon ones, if I’m able to create them. 😎

  5. Greensboro Web Design March 1, 2010 at 8:44 pm #

    Thanks for this article. I used an online conversion program to create my favicon from an existing picture that I wanted to use. It saved me from having to edit individual pixels. I forgot to add the code to my header though. I was quickly able to sort things out with your help. Thanks again.

    • AgentSully December 19, 2010 at 11:45 pm #

      @Greensboro – that’s awesome! Glad to hear it! Thanks for commenting.

  6. funny tshirts March 2, 2010 at 6:48 am #

    great post.. the importance of a favicon in your blog is of a high!

  7. AmishFurniture March 12, 2010 at 5:09 am #

    Congrats! Great site you have there!

  8. della March 15, 2010 at 5:21 pm #

    really easy.

  9. somemap March 15, 2010 at 10:14 pm #

    very useful info !! favicon is like a symbol for figure out of ourselves.. hmm.. I think I have to add this favicon to my site soon.. thanks for sharing.

  10. Farnborough Plasterer March 17, 2010 at 5:05 pm #

    Hello,

    A favicom is awesome i have been using them on my site for years and my clients love them! I have found it hard to get really clear ones but still what I do is always good enough

    Great post

    JJ

  11. nicidoggy March 18, 2010 at 3:43 am #

    That’s really useful

  12. Rome Italy Hotels March 18, 2010 at 1:42 pm #

    that is quite interesting to know that A favicon is short for “favorite icon.” I like the post very much and find out it is very informative and interesting as well.

  13. Rami James March 19, 2010 at 4:40 am #

    I actually really don’t like favicons. They make my bookmarks look like someone threw up in them 🙁

  14. ccnner March 20, 2010 at 9:57 pm #

    Thank you, and learned.
    This is my blog , please exhibitions.

  15. kaka March 23, 2010 at 1:37 am #

    Hello! Do as you say, and eventually successful, so thank you very much, thank you very much, save me a lot of time!
    My blog is very beautiful!

  16. Kelvin Lee March 24, 2010 at 7:56 pm #

    I have been running a blog for about 2 years but this is something that I did not pay attention to previously.

    Even if I did, I do not know where to get it done. Really thank you for your detail explaination on how to get a favicon.

  17. Used Plastic Machinery April 1, 2010 at 3:05 pm #

    Great article, this is one of the things that gets overlooked by many people. It one of those things you don’t realize you need until you see it in your browsers

  18. telefon ba?vuru April 13, 2010 at 12:59 pm #

    thank you very much this is good idea. iwasn’t know wp can support this

  19. Dan Nicolas April 16, 2010 at 5:29 am #

    Hi found your content to be very interesting appriciate the good work you doing… 🙂

  20. Thorn May 1, 2010 at 12:08 pm #

    I’m totally going to use this on my site. Put my little face on it as a favicon

  21. High-End Machines May 22, 2010 at 8:48 pm #

    very interesting. i think it can really make your site stand out from a crowd of tabs. just have to make a unique icon.

  22. NP Jara May 24, 2010 at 10:46 am #

    So that’s what those icons are actually called! This is the first time I’ve actually come across the word “Favicon”. Thanks for the clear explanation and step-by-step guide. Will try that with my blog.

  23. Used Vehicles September 9, 2010 at 4:53 am #

    This is what I was looking for. Can you explain the same for blogspot blogs.

    • AgentSully October 24, 2010 at 9:08 pm #

      Sorry, I don’t have info on favicons for blogspot blogs, but I’m sure if you did a simple search on Google, you’ll find just what you’re looking for!

  24. SenseiMattKlein September 18, 2010 at 7:48 am #

    This is great. Used it to put a favicon on my site. Thanks.

  25. Vic October 11, 2010 at 12:02 pm #

    Hi, I found your blog at the list of personal development blog in one blog I just visited. Favicons are very important in branding – as it can also represent our logo and personality. It’s easy to do using free online favicon generator.

    • AgentSully October 24, 2010 at 8:38 pm #

      Thanks Vic – glad to have you visit!

  26. Soohow November 7, 2010 at 11:45 am #

    Nice and easy to follow, great for my blog 🙂 Thank you

  27. Arnaud Powell November 12, 2010 at 3:35 am #

    Sounds like a nice way to add a personal touch on my wordpress blogs.I will surely do this to my wordpress blogs as soon as I can create a unique icon.Real helpful to me dude.

  28. Ada Harriotts November 14, 2010 at 6:20 pm #

    Yes thanks for the post. Its funny how quickly that we forget simple things to do with branding of our sites. I for one will put a favicon on my blog. I have changed my favourites and searching through the folder which is now alphabetical, I have a lot of problems that a favicon would ease

  29. sr22 insurance quotes December 6, 2010 at 1:37 pm #

    Thanks for the Favicon instructions because I didn’t know how to set that up. I’m going to bookmark this site because you have some great blogging tips here!

  30. Blazingtec December 7, 2010 at 12:42 pm #

    Thanks! Now I managed to get my favicon!

  31. Arbesdj February 22, 2011 at 12:57 pm #

    So many times i tried to do that things,thanks for your article,it’s make it easy right now…..

  32. eliathah March 29, 2011 at 10:33 am #

    awesome! i’ve been wondering how to do this for a while. who knew it was so simple…

  33. webpages April 19, 2011 at 4:25 am #

    Thanks for information i got a lot of idea how to optimize my blogs

  34. shareiteasy May 7, 2011 at 7:19 am #

    Favicon make your webite address attractive when you browse your site on the browser.It help you to branding your website.Also when you make bookmark or create shortcut of this site,there will display your favicon which make easy to distinguish your site from other.
    Thanks a lot for sharing this great idea here.

  35. Dialysis Technician August 14, 2011 at 9:04 pm #

    Thank You. Finally someone explained how to do this so even I could understand it. I’ve been building websites for about a year and finally I’m starting to earn some money and have been wanting to add a favicon to give my sites that “polished” professional look.

  36. ace November 4, 2011 at 2:39 pm #

    simple and easy way to add favicons.. thanks for the post!!

Trackbacks/Pingbacks

  1. Complete Guide to Set Up a WordPress Blog and Make Money | Life Learning Today - February 15, 2010

    […] out how to add a Favicon to your site. A favicon the little image that appears in the tab of your browser along with the title of the […]

  2. Wordpress favicon einbinden - March 31, 2010

    […] How to Add a Favicon to Your WordPress Blog | Life Learning Today […]

  3. What Is a Blog? « blogtalktip - October 4, 2011

    […] out how to add a Favicon to your site. A favicon the little image that appears in the tab of your browser along with the title of the […]

Leave a Reply

CommentLuv badge

Loading Facebook Comments ...
Loading Disqus Comments ...
  1. […] out how to add a Favicon to your site. A favicon the little image that appears in the tab of your browser along with the title of the […]

  2. […] How to Add a Favicon to Your WordPress Blog | Life Learning Today […]

  3. […] out how to add a Favicon to your site. A favicon the little image that appears in the tab of your browser along with the title of the […]

Powered by WordPress. Designed by Woo Themes

UA-1513612-1
%d bloggers like this: