How to Add/Change Blogger Blog Favicon?

-

What is favicon?

While using IE, Firefox or Opera you will see an icon on the tab when you visit a page.This is called favicon. Favicon is a small icon/picture (usually 16px x 16px in size) shown next to site URL in the address bar. In Blogger, by default orange colored blogger icon is shown as favicon which looks ugly and it is common also as lakhs of blogger blogs contain this. Also having your own favicon with a nice graphical reminder of your site beside is a good way to attract visitors attention.

As you all know, Blogger has a new feature which allows you to change your blog's favicon without HTML coding (you still can use the codes if you want though).



Add/Change Blogger Blog Favicon?


  • Log in to your Blogger's Dashboard
  • Go to the Layout
  • Click on the favicon Edit link usually present at the top left corner.





Now hit "Choose File" button.






  • Browse for your own image(should be less than 100 KB) and select it.
  • Blogger will automatically re-size it,and finally hit the "Save" button.

Now refresh your blog you will see your new favicon,If you can't then delete browsers cookies and caches then visit your blog.


Another Way To Change Blogger Blog Favicon


Here is another simple way to change your blog's favicon.

Go to Blogger Template>Edit Html
There find the title tag which looks like
<title><data:blog.pageTitle/></title>
and immediately after that add the following code after proper editing.


<link rel="shortcut icon" href="URL of your icon file"/>

Remember to replace URL of your icon file file with your icon file's URL
Your new favicon should start appearing in some time.

Well, some blogger, have been facing some trouble with their favicons because Blogger wouldn't show them at all or wouldn't update them to the new one.

If the favicon on your Blogger blog does not update, make sure you clear all history from web browser and then check for it. 
                                             OR
If you changed your favicon on the Layout section of your blog or used the HTML code and it doesn't work or doesn't show the right favicon, just do the following steps:

Step 1: On the address bar, type http://[your blog url]/favicon.ico and press Enter.
Step 2: Refresh the page.
Step 3: Go back to your blog.




Manual method to add Favicon to Blogger blog

To get started, first you need to backup your Blogger template: Click on ‘Layout’ > ‘Edit HTML’ and then click on ‘download full template’ to save it on your computer. Now perform following steps to a change favicon in your Blogger blog:





1. Click on ‘Layout’ > ‘Edit HTML’
2. Then add following code after <head>
<link href=’http://www.URL.com/favicon.ico’ rel=’shortcut icon’/>
<link href=’http://www.URL.com/favicon.ico’ rel=’icon’/>
Above http://www.URL.com is the web address or location where your favicon is stored (hosted).
‘favicon.ico’ is the name of your favicon file. You can use any name like myfavicon.ico and so on. After adding above code, update the http://www.URL.com and favicon.ico in the code. Then click on save template button. Open your blog and your new favicon should be visible in the address bar.
  1. Go to Blogger Dashboard > Template
  2. Click Edit HTML
  3. Hit Proceed button
  4. Now find for below code in your template
<title><data:blog.pageTitle/></title>

add below code immediately after of above code

<link rel="shortcut icon" href="URL OF YOUR ICON FILE"/>

Replace URL OF YOUR ICON FILE with your own icon.
Now save your template and you are done..

Comments

Post a Comment

Popular posts from this blog

How to Create a Contact Form in Blogspot.

-
Image
Creating a contact form in Blogger.com is always a challenge to them those who don’t have any coding knowledge. In this post we will show you how to create a contact form in BlogSpot with very little bit coding knowledge or even you don’t have any coding knowledge. A contact page is a very important page for a website. It bring authority look and professional manner, helps to the reader to contact with the blog author and helps to create a community gradually. Moreover the search engine boot give preferences to some mandatory pages, yes the contact page is one of them. Google loves the contact page very much. Reportedly Google announced their contact form widget to their free blogging platform Blogger.com . But the problem is you can add this widget to the sidebar of your blog but can’t use it as a new contact page. I was facing a huge trouble to create the contact us page. If you are facing the same problem, don’t worry, I will discuss in this post step by step that how you
Read more

How to Manually Install a WordPress Plugin?

-
Image
One of the things that makes WordPress attractive to writers with little or no technical skills is that it’s so darn easy to use. During WordPress’ early days, we used to tell people that if they knew how to use a word processor like WordPerfect (remember that one?) or MS Word, they could use WordPress. It even used the same ribbon and later, the same icons! This will change as WordPress moves to the Gutenberg editor, now available in beta test mode, but a plugin will allow stubborn users to keep the old ribbon. And speaking of plugins, do you know how to manually install a WordPress plugin? Like manual backups, it’s a basic skill that’s helpful to have. Why Would I Install a WordPress Plugin Manually? You want to know how to do a manual plugin install because believe it or not, there’s a huge world of WordPress plugins that aren’t listed in the directory that comes with each WordPress installation. If you find something you like outside the directory, you’ll need to know how to manual
Read more

How To Add Contact Form on Contact Us Page in Blogger (Step by step Tutorial)

-
Image
How To Add Contact Form on Contact Us Page in Blogger (Step by step Tutorial) Adding contact us form is very important for a professional blog. Contact us page help visitor or brand to contact the blog owner for anything related to this website like advertising, query, gadget reviews or any suggestions. Most of the blogger use third-party sites (Like foxyform, 123contactform, jotform etc) for adding contact us form on their blog. But in this article I will show you official way to add contact us form on Contact Us Page in Blogger. First I will show you how you can add contact us form then show how you can add Contact us form on Contact Us Page in Blogger. Adding Contact form on blogger sidebar Steps for Adding Contact form on blogger sidebar Step 1.   Open blogger and click on ‘Layout’ section. Step 2. On blogger Sidebar click on “Add a Gadget”. Step 3.Here click on More Gadgets. Step 4. Click on Contact Form Step 5. Click on save to save Contact Form in blogger sidebar. Now to add con
Read more