How to Add Custom Favicon to Blogger Blogspot Blog

How to Embed YouTube Videos in Blogger Blog Posts
How to Add Facebook Chat Emoticons in Blogger Comments
How to Hide Blogger Navbar in Blogspot Blogs

Favicon means ‘Favorites Icon’ which is the small size picture (16px X 16px or 32px X 32px) usually and you can see it in your browser address bar. In Blogspot blogs, by default blogger added their own favicon that shows your blog is on blogger platform. But you can also change or add your own created custom favicon into your blogger blog.

Having your own custom favicon with amazing graphics that make your site is so good and grad more attention to your visitors. Blogger users can be easily change or add a custom favicon to their blogspot blog just by going into the ‘Layout’ section.

custom favicon to blogger blog

If you’re a newbie blogger and newly use blogger platform, then you can read this whole tutorial in which I show you how to change custom favicon in blogger.

Are you want to make your blog more personal and unique from others then this is also an important step that helps you to make a good design and identity of a great looking blog.

Today, I will show you how to add a favicon to your blogspot blog easily. Just scroll down the page and learn how to do it without any hurdle.

How to Add a Favicon to Your Blogger Blog

Step1. First of all, go to and sign into your account using Gmail account.


Step2. Select your blog and go to the ‘Layout’ section from the left sidebar options.

Step3. Go to the any Favicon Generator Services and create your own custom favicon using the PNG or JPG image.

Favicon and App Icon Generator

Favicon Generator

Step4. Click on the “edit” links on the “Favicon” setting above the navbar element of your blog.


Step5. Now a pop-up window appear where you can browse your custom favicon into your computer hard drive that will replace the default Favicon image. Then click on the “save” button.


Step6. All done! now you should see your own Favicon instead of the default Blogger’s icon.

bloggerhope favicon

Sometime it appears quickly, but sometime it might take time, so wait for it until your new Favicon will appear in your browser’s tab or window.

Method2: How to Add Custom Favicon in Blogspot Blog

Are you know about codes (HTML + CSS + XML) then you can also add animated favicons to your blogspot blogs, simply use this method.

Step1. Log in to your Blogger account.

Step2. Select your blog and go to the “Theme” option from the left sidebar options and click on the “Edit HTML” button.



Step3. Click anywhere and inside code and press the CTRL + F to find some tags. Simply copy below tag and paste inside the search box and hit enter.


Step4. Now copy below code and paste it just above this tag.

<link href=”your-favicon-links-goes-here” rel=”icon” type=”image/gif”/>

NOTE THAT: Replace favicon URL with your own favicon image URL.

It’s done! save your theme and now see your blog and check the magic to change the favicon in blogger blog. I hope you like this tutorial, if you have any question in your mind, comment below.