How to Change Favicon in Blogger (2020 method) - PBT

How to Change Favicon in Blogger
How to Change Favicon in Blogger

Do you have a custom favicon in blogger? If no then, you really should have one. Many bloggers and website owners are still using the default favicon in blogger or they don’t have one.
It is important to replace the default favicon in blogger with your custom favicon for creating a brand for your blogger blog,

If you’re one of those without a custom favicon in blogger and want to add it, then follow this simple post on how to change favicon in blogger. I assume that you all have a custom favicon, if not then check out this post on How to create favicon for Blogger.

    How to change favicon in blogger?

    There are two methods to change blogger favicon and both the methods are working. If you have updated to the new Blogger version then the first method may not work for you, try the second method, it will surely work.

    Method 1 - Changing favicon in Blogger via Layout

    How to Change Favicon in Blogger (2020 method)

    1. Log into your Blogger
    2. Click on Layout and find Favicon Widget situated at the top.
    3. Click on Edit and then new window will pop-up with a message saying Upload custom favicon, Please use a square image that’s less than 100KB
    4. Click on Choose File on a pop-up window.
    5. Select your favicon icon file and click on Save and then refresh your website once.

    That's it, you have successfully added favicon in blogger. Now you can see your custom favicon instead of default favicon in blogger.
    Note: Favicon widget has been disabled on the latest version of Blogger, to enable it, revert back to Classic Blogger and follow the above steps. Once you have followed all the steps you can switch to the new Blogger version. Check the below image.

    How to Change Favicon in Blogger or Blogspot

    Method 2 - Changing favicon in Blogger by editing HTML template.

    If the first method is not working for you, then you can try this method to add favicon in Blogger and it will work for sure. Just follow the below steps carefully.

    1.  Log into your Blogger
    2. Go to "Template" and then click on "Edit HTML".
    3. Search for <head> tag and paste the below code just below <head> tag and enter the url of your favicon icon.
    <link href="http://place-your-favicon-url-here" rel="icon"/>
    <link href="http://place-your-favicon-url-here" rel="shortcut icon" type="image/x-icon" />
    4. After adding the code click on "Save" and refresh your site once.

    Not able to see Favicon in Blogger?

    Sometimes you may not see your favicon right away after uploading it. Verify that the favicon is uploaded properly by typing http://yourblogurl.com/favicon.ico in your web browser’s location. If you still don’t see the favicon then clear your browser’s cache and check once again.

    You may like to read this: Ultra Fast Loading Blogger Template.


    Conclusion

    When designing your blog or website, we all want to make sure that we don’t leave out any of  the details, even the smallest ones. It’s not that hard to add or change favicon in blogger and it’s one small thing that shows you have made your design through and that you care about each and every details of website or blog.

    Don't think too hard about what to use for your custom favicon, don’t stress out about it. Yes, it is a small thing, so you need to think little bit, as long as it’s unique and can be identified, it's great. 
    I hope you like this post on how to change favicon in Blogger. If you have any doubts or if you face any error or if you want my help then to fo leave a comment below. I will surely help you out.

    Post a Comment

    2 Comments

    1. i'm not able to add favicon in my blogger? can you please let me know, as favicon option says "your icon saves" but can't find it on my blogger tab.

      ReplyDelete
    2. Have you updated the Blogger to Latest version if not then first do that.

      ReplyDelete
    Emoji
    (y)
    :)
    :(
    hihi
    :-)
    :D
    =D
    :-d
    ;(
    ;-(
    @-)
    :P
    :o
    :>)
    (o)
    :p
    (p)
    :-s
    (m)
    8-)
    :-t
    :-b
    b-(
    :-#
    =p~
    x-)
    (k)