Blog

July 23, 2009

How to Add a Favicon in Thesis Theme?


Before using Thesis on Tech Exclusive, I visited few blogs with Thesis theme. I discovered amazing aspects and features of this theme, but one thing I found missing in all blogs was the favicon.

Favicon  is used to display the unique identity of a website/blog on the address bar and browser tab. It is one of the important features of professional websites as it brings more authority and credibility to website and its users.

If you don’t know anything about favicon then you can refer our simple tutorial to create a favicon for website, which will give you a perfect idea of favicon and its installation process. However, adding a favicon in Thesis theme is little bit different from normal blog themes. Use the following tutorial to add favicon in Thesis theme.

Steps to Add a Favicon in Thesis Theme

1. Get a favicon.ico image file. (Preferably, 16×16 pixels)

2. Save it on root directory of your blog.

3. Open WordPress dashboard and select Thesis options.

4. Scroll down to Header Scripts and copy-paste following code in text field.

<link rel=”shortcut icon” type=”image/ico” href=”favicon.ico”>

Header Scripts

For animated favicon -

<link rel=”icon” type=”image/gif” href=”animated_favicon.gif” >

5. Click on Save Button.

Now, check this favicon in different web browsers. Enjoy. :)







52 Comments


  1. Great, now I can add a favicon to my thesis theme blog !


  2. Great, now I can add a favicon to my thesis theme blog !


  3. Thanks for the helpful tutorial! I really do appreciate it.


  4. Thanks for the helpful tutorial! I really do appreciate it.


  5. Awesome!

    Had been looking for this for ages!!


  6. Awesome!

    Had been looking for this for ages!!


  7. Thanks, that works great.


  8. Pee Jay

    I followed the guide however the favicon only appears in the home page. what seems to be the problem?


  9. Pee Jay

    I followed the guide however the favicon only appears in the home page. what seems to be the problem?


  10. [...] customization is not as easy as it sounds. I have written tutorials on how to add twitter field and how to add favicon in Thesis theme, which requires technical knowledge of WordPress. Today, I am sharing another tutorial to include [...]


  11. shivaraj

    Simple,Excellent Tip,
    working gr8..
    Thanks.


  12. shivaraj

    Simple,Excellent Tip,

    working gr8..

    Thanks.


  13. This is exactly what I was looking for! I was putting the favicon in the thesis directory… duh! ha ha!

    Thanks so much for the info! :-)


  14. 250+ Thesis Theme Resources | Sahil Kotak dot Com

    [...] How to Add a Favicon in Thesis Theme? [...]


  15. I can’t get my favicon to show…when I taook the code and put it in notepad and then copy & paste it into my header script it converted what I pasted into this…

    Did I do something wrong, because I can’t figure it out? I put the 16×16 favicon.ico in my public_html file???


  16. Dave K.

    Ditto here. I put the favicon.ico in both public_html and thesis 16 main folder, and still no luck ….


    • Dave K.

      Finally got it to work, by pasting this in the Thesis header scripts box:

      There are a couple of other script lines out there that didn’t seem to work. But this one does, so no worries. Thx for the reply.


  17. Don’t put the code in thesis folder. Paste it into root directory of your blog.


  18. Dave K.

    Oops. not showing the code. Let’s try this, without the brackets:
    link rel=”favicon” type=”image/ico” a href=”favicon.ico”


  19. Didn’t work for me the first time because your quotation marks didn’t copy and paste properly into the Thesis control panel. I had to replace them with quotation marks of my own and then it worked!


  20. lacorbeau

    I tried to add favicon on thesis. I added my favicon to the index on thesis theme and uploaded with filezilla but it didn’t work. Could you tell me what I may be doing wrong. I added the name of my favicon into the code after href=”myfavicon.ico”. and that didn’t work either. I tried it both ways just the way you had said to copy and paste and then with adding the name of my favicon. Thank you


  21. Wow! It’s nicely and easily described. I am going to add a favicon on my site now……..

    tnx for the article.


  22. It’s not working on my site……..I don’t know why :P


  23. Thanks a lot for this, I was wracking my brains trying to remember how I did it in other themes and didn’t think to use the simple box that Thesis provides for things like this. Hopefully in 1.7 they’ll add a tickbox for the favicon to make it easier for new users.


  24. Fri

    Hi Harshad,

    Thank you so much for blogging about this. I'm having trouble getting my favicon to work. I saved the .ico file to my root folder, and posted the link. Still no bueno. Please help.


  25. Can you post the link of your site here?


  26. It's working at my place. Try to clear old cookies from your browser.


  27. Fri

    mmm…i just cleared my cookies and cache. WHen you type weddingnouveau.com/favicon.ico, it works. How do I get it work when you just type the homepage weddingnouveau.com?


  28. Fri

    wait, I'm seeing that it's working on safari. Is this a browser issue? As in, does firefox have different settings?


  29. I am using Firefox and it still shows favicon of your site. I think your browser has some old cached files, which are not allowing you to see the new favicon in browser.


  30. zjuul

    The above code shouldn't be copy-pasted because of the 'fancy' quotes. Also, there is a / missing in front of favicon.ico.

    This works:
    <link rel=”shortcut icon” type=”image/ico” href=”/favicon.ico”>


  31. Nadia

    how add favicon on thesis 1.7?


  32. Awesome, this is so easy! Worked for my site excellently :-)


  33. Use the same method.


  34. Bhaveek

    thanks harshad I was using a plugin for that, with this tutor I can directly use it on my blog. This will improve my page loading speed.
    thanks for help.


  35. gofur

    tanks for this post,,im new use thesis,,,,,



Leave a Reply

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

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>