Knowledge is good only if it is shared. As a new blogger, I had learned to change the Web template, and found out the tips, tricks, hacks, and tweaks of altering the Blogger template, customizing CSS, widgets, layout, blog design, inserting JavaScripts, HTML codes, Google AdSense, and other settings the hard way, through many trials and errors. For the purposes of this guide, I had started with the old Blogger “Minima” template. As I made the changes or learned something new, I had documented them. Before changing any template, please remember to save a copy of the current template. After editing the template, preview it, and save it when you are satisfied with the change. Hope this guide will help those who are finding the way around, just like me.

Search Tips for New Bloggers

We have extended our month-long vacation by a couple of days. We shall be posting articles the moment we return. We noticed that Google had updated the Page Ranks. New bloggers who have been waiting anxiously for this can check their blogs' Page Ranks. We have the PR checker link in our SEO Tools - Search Engine Optimization article.

The blog we created recently in Aug 2007, Blogger FAQ and Help, has also got its first Page Rank, a PR4. All our blogs are now ranked:-

Tips for New Bloggers - PR6
Business Fables and Management Lessons - PR4
Famous Motivational and Inspirational Quotes - PR4
Blogger FAQ and Help - PR4

Thanks to everyone for the support!

Feb 9, 2007

Digg This Story

Add Favicon icon to Blogger URL

Have you wondered how these little icons appear next to the web addresses, like the one you see above? When you visit the sites or bookmark them, these icons will make these URLs stand out. These are “Favicons” or “Favorite Icons”.

You would first need to have an icon which you would like to use, bearing the extension .ico format. If you search your hard disk, you might find some icons which are generic. I would suggest that you create one to represent your own unique identity. There are quite a number of free icon editor software which you can download from the net.

As for myself, I went to Download.com site and downloaded a very small program called Imagicon which can transform images into .ico format. I created an image using Photoshop. You can use any image or pictures if you do not wish to create one. Next, run the program. It is rather simple to use. While you can create icons in 2 sizes – 16x16 and 32x32 – I would think a 16x16 icon is preferable since it is readable in most older browsers.

If you do not wish to download any software, you may also try creating an icon online. Just enter the keywords “online icon generator” into your Google search bar, and you should be able to find several programs that you can try.




Once you have created an icon, save it into your hard disk. The next step of attaching the icon is a little tricky. Ideally, all you need to do is to save it in the root directory of your blog site. Nevertheless, there is no way this can be done. For one, if you try to upload an icon image, Blogger will reject it. Two, any file that is uploaded will not go into the Blogger root directory.

The only method to use will be to upload the icon into some web folder, and create a link. You can read about using free hosts like Google Page Creator and Google Groups. We have also a rather comprehensive list of free Image Hosts and File Hosting Services in our article on Manage Blogger Image Storage Space. Check out those sites and choose one that is fast, reliable and allows uploading of .ico files.

Once you have done that, take note of the URL of your icon. If you are using Google Page Creator, hovering your mouse over the link, you will see that the file is stored under a directory which looks like this http://yourname.googlepages.com/iconname.ico
where “yourname” is your Gmail account name, and “iconname” is the file name. Copy this URL.

Go back to your Blogger dashboard and under the Template tab, go to “Edit HTML”. Near the top you will see a line like this:-

<title><data:blog.pageTitle/></title>


Update:

Copy and insert the following code below the line:-

<link href='URL of your icon file' rel='shortcut icon' type='image/vnd.microsoft.icon'/>


Inserting this will also work but the former is preferred:-

<link href='URL of your icon file' rel='shortcut icon' type='image/x-icon'/>


Remember to type in the “URL of your icon file”.

Save the template. When you refresh your blog site, you should see your nice little Favicon next to the blog address.

Other image types

The .ico image format has been used by many but you can also create an image under the .png or .gif format. Ensure that the size of the image is either 16x16 pixels or 32x32 pixels.

If you have a PNG format image, the link to insert is:-

<link href='URL of your icon file' rel='shortcut icon' type='image/png'/>


If it is a GIF format image, the link is:-

<link href='URL of your icon file' rel='shortcut icon' type='image/gif'/>


External Domain

For those who have hosted sites in external domains, insert the link in the root directory as well. Otherwise, you can upload the file into the root directory and name it favicon.ico

As an example, if your domain name is www.domain.com, the URL of the favicon will be www.domain.com/favicon.ico

This method is not preferred but a number of browser versions are able to process the icon. Since we do not have external domains to try out this alternative, you may want to see if it works for you.

Compatibility

While you can see the Favicon in Mozilla Firefox, many have problems seeing the Favicon in Internet Explorer. This is a known problem and has been a sore point with many IE users. In some versions of IE, bookmarking the site will display the Favicon. This is not necessarily so in IE7 that we are using. In fact, when we bookmarked the highly popular search engine sites, their Favicons don't show in our IE bookmarks too although they show well in Firefox. Perhaps this is one more reason to download Mozilla Firefox if you have not already done so.

© Tips for New Bloggers

Found this article useful? Mention us in your post, subscribe to our feed, link to us, or bookmark this site. Thanks for your support!AddThis Social Bookmark Button

142 comments:

James said...

Just stumbled on your site after doing a search for how to change the Fav Icon when using Blogger. Worked like a charm! Gonna read through you other posts now and see what else I can learn to geek-out my daughters blog; www.deannafemoore.com

Cheers,

James

Knightn said...

this post is awesome!! Thanks for the tip!!

Mark said...

great explanation!! greets, Mark

My Blog.. I guess

Droplet said...

Totally helpful. Thank you so much.

Oh, don't go to the site. It's smutty. But this worked!

Spencer Ferguson said...

Very nice post!! Thanks for the tips.

goodearth said...

really rockz!

B@B@ said...

Wao this work perfect...

Candace Dempsey said...

I love it. I thought it would be really complicated, but it worked the very first time. Thanks so much.

dean-dzai said...

Worked like a charm. However I had an issue with Google Page Creator, it displayed the Google Page Creator logo instead of my icon. I had to resort to 'geocities' *shudder*. Works great, although it first loads with the Blogger logo then after a few seconds changes to mine...

http://life4two.blogspot.com/

WebStractions said...

While leveraging Google to host the images and apply that to Blogger is ingenious. Nice work.

One thing I should point out however ... this method will only work in Firefox, not IE.

IE grabs the icon from the root domain, in this case blogspot.com. If you save your blog as a Favorite in IE, then it will show the orange Blogger B

Rider Nights said...

Hello there. Thanks a lot. For me, it works perfect on both IE and Firefox.

I am using IE7 and Firefox2, running on WinXP Pro and the other on WinXP Home. I bookmarked your site in both browsers and the icon shows!

AsSphere said...

nice work.. it work perfectly with my page.. thanks a lot bro..

About Us said...

It worked great for a day and now when it I look at the template it will not keep it in the same code. It changes the " to ' and changes the order of the code. Any suggestions???

bizwhiz said...

Hi About Us

Don't worry about it. When you save the template, Blogger automatically standardizes the code and rearranges some of the elements. The substance is the same.

We sometimes explain codes in a way that is easily understood by most of us. What matters is that the Favicon code works, which in your case it does. I see your favicon in my browser. And you have a nice template too.

skiddtrader said...

I was looking at a way to upload files into blogger root directory when I came across your blog and it is very helpful in making me realise there is no way to change the root directory of blogger.com itself.

I was trying to add my favicon based on some other guide in the net and it didn't say if it workds for third party blog sites.

Thanks a lot mate, I'll try this when I get home.

Tim said...

You can host an icon here http://www.imagedip.com/
This is where I have my "favicon" hosted.

Hilda said...

I'm sure I'm doing something wrong although I'm following your instructions to the letter (which has worked for me on a number of other topics here), but google page creator uploads the file but doesn't give it a link so that all I can do is download it if I try to open it. I'm thinking perhaps the file is too small or something? (3kb) I truly have no idea, I can't figure out what I did wrong.

bizwhiz said...

Hi Hilda

You probably did everything right. You can't click to open .ico files. What we want to do is to obtain the image URL which goes something like this http://yourname.googlepages.com/iconname.ico

And when you have that URL, you can insert it into the template. The browser will pull this icon and display it in the browser window.

Hilda said...

the problem apparently occurs when I upload the ico file to google page creator, it uploads the file but says that most browsers do not support this type of file. The file is in the image section but doesn't appear in the page no matter how I try to upload it, so that if I roll over the file name, the only thing that appears is a query as to whether I want to download it. Am I explaining myself clearly? I'm looking for other favicon hosting pages right now.

Hilda said...

never mind, I got it to work with Google Groups, oddly enough.
Thanks a lot for your help, and for creating this site overall. It's the only site that gives clear step-by-step explanations on how to modify blogger code.

bizwhiz said...

Hi Hilda

Glad that it works. I can see your S&B icon in the browser :)

Just an explanation - the file .ico is unlike other image files. When you have uploaded it, it will show in the Uploaded Stuff section. You can't click the link. But when your cursor is over it, you can see the URL of that ico file.

Well, Google Groups is also a good place to store files. What I like is that we can organize the files and folders. For example, you can have images for one blog stored in one folder, and images for another blog in a separate folder. Easier to manage.

Kaliqo said...

Thanks for the info. I uploaded the file to my account on Ripway and it worked great.

Cornelius said...

Hi!

I have some problems with the favicon.
It simply doesn't appear. But I did
exactly what you wrote... :-(
Can you help me, please? Thank you!

bizwhiz said...

Hi Cornelius

Would you like to put the link into your template so that I may take a look? Presently, all I could see is link rel='' under the Title.

Cornelius said...

Done! I added the link Google Groups gave me. Thank you so much for your help!

Cornelius said...

Now it works! I added this:

*link href='LINK TO ICO' rel='Shortcut Icon' type='image/x-icon'/*

Don't know why... thanks again!

Peter McCartney said...

Hi! from down under. Have spent hours trying to add a icon to my post title. Failed! But have not given up! To take my mind off my obesssion I found something else to do. Found your site, did what you said, & hay presto got it to work.
Regards Peter McCartney

http://stvincentsdarlinghurstmalenurses.blogspot.com/

goodearth said...

worked well on one of my previous blogs, but not working on this!!!

please take a look:
http://chemical-magic.blogspot.com

Smriti said...

Awesome! Just added one to mine. Thanks!

bizwhiz said...

Hi goodearth

If you look at your favicon link, you have an extra " at the beginning. You may want to remove it. It should work fine.

DErifter said...

Quick and easy. Thanks.

goodearth said...

many many and many thanks. you are great.
goodearth

Anonymous said...

That's awesome! Worked great!

Tee said...

This is exactly what I've been looking for but it's not working.

I uploaded my file to my googlepage and copied the code as shown to my template. I *do* have a a favicon now, but it's the same as GooglePageCreators! (Like a blue folder/window in front of a maroon folder/window.)

The favicon I have uploaded should be a letter S on a maroon background.

Any chance you'd take a look and let me know what's up? Thanks!

bizwhiz said...

Hi Tee

Would you care to upload the icon again but this time rename it to something else? Like spiltmilk.ico or whatever? I do not know the actual cause. Our link is via googlepages too.

Tee said...

Changing the name of the icon worked! I <3 you. LOL.

Perhaps Googlepages calls their favicon "favicon" - and that's why I got theirs instead of mine.

The big problem I ran into was that every favicon generator that I used automatically named the file favicon.ico - and wouldn't allow me to rename it.

I had to download a (free) program called Irfan View and rename the file in it (since I couldn't name any files with the extension .ico in any of my regular graphic programs.)

Hope that helps anyone else who runs into the problem.

Thanks so much! I've wanted a favicon for months and kept giving up. I thought it wasn't possible on Blogger. Awesome :)

Jodi said...

I have been trying to figure out how to do this forever! I wish I had found this then. Thanks so much for all this great information. Now I am truly a custom blogger. :)

Matt said...

I have a blog published via FTP.

It's hosted on free webspace from my ISP, so the blogger "site name" isn't the true address of the blog, if that makes sense.

Anyway, if I type in "www.Blogname.com", I don't get a favicon at all.

If I type in "www.myisp.com/~username" I get the favicon I've set up.

Both of these access the same file, which is stored at myisp.com/~username/index.html

Does what I'm saying make sense?

So the question is: is it possible to make the "Blogname.com" url load the favicon?

bizwhiz said...

Hi Matt

If you have root access to the files, you can upload the icon into the root directory. Name it:- myisp.com/~username/favicon.ico

Let us know if it works as we have no experience with FTP publishing.

Matt said...

I have the favicon uploaded as you suggest:
myisp.com/~username/favicon.ico

And it works if you go to
www.myisp.com/~username/

But if you type in
Blogname.com

it doesn't work.

Now here's something I noticed.

If you go to blogname, and click on "view source" you get this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Blogtitle</title>
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</head>
<frameset frameborder="0" framespacing="0" border="0" rows="100%,*">
<frame name="TOPFRAME" src="http://myisp.com/~username" noresize>
<noframes>
<body>
<h1>Blogname</h1>
<br>
<br>
<br>
Click here to enter <a href="http://myisp.com/~username">http://myispa.com/~username</a>
<hr>

</body>
</noframes>
</frameset>

</html>

Needless to say, this is not a file that exists on the FTP server.

So where does that leave me?

Other than confused, I mean.

Matt said...

Ah. I think I've figured it out -- that's not a blogger page; it's the URL "forward" from the domain registrar.

Thanks,
Matt

ZtrixQ said...

Hi!

Thanks for the great tip. It worked very well on my blog - http://ztrixq.blogspot.com/

-ZtrixQ-

Ram Arvind Kotaru said...

After many successful attempts to create a favicon for my blog, I really got frustrated and was about to leave off trying again.

Just in time, I came across your blog and it was a very simple hack unlike the confusing stuff I read earlier.

Thanx a lot. I mean it.

Félix González said...

My problem here is that I don´t know how to get images with .ico extension. ¿Can you help me on this?.

bizwhiz said...

Hi Félix González

We used a free software called Imagicon. What it does is to take any image that you have and convert it into a small .ico file. It can be your photo, a logo, etc. You can also search the net for 'icon generators' and try those services.

justvenkys said...

U are running a blog with very nice stuff dude.. I have added music icon to my blog www.distractedguy.blogspot.com

Anyway all the best..

LDE said...

Thank for this Tip

very helpfuland it work for my blog http://lde-sap-bw.blogspot.com/

dixychik said...

I did it, I did it, I did it!!! Thank you so much for this site ... where have you been all my life? ha!

dixychik said...

Oops ... mine stopped working now. What happened? It worked like a charm and now it just vanished.

bizwhiz said...

Hi dixychik

What is your blog URL? We can see if it has been correctly inserted. Sometimes it can happen because different browsers and versions of browsers behave differently.

dixychik said...

Hi.

http://dixychik.blogspot.com/

Nothing much there yet because it is brand new and I am still trying to figure out how to get a background tile on it, and make it 3 columns. But if you have time to look at my little favicon, I'd appreciate that very much.

bizwhiz said...

Hi dixychik

I can actually see your nice pink favicon in both IE and Firefox browsers. Maybe you can ask your friends to view your blog just to confirm that they can see it too.

dixychik said...

Thanks for checking it for me! I can see it in my Favorites folder on the link to that site, but when I get to the site, I can't see it at the top of the page. I could when I first installed it, but now I can't ... isn't that weird? I am using IE. My computer is giving me fits, so maybe that is the problem, but as long as you can see it, I'm happy ha! Thanks again, and I greatly appreciate your site!

vinceandcarlaplus said...

mine doesn't work on IE7 and Opera Vista/winXP. works great on Firefox though. Care for anyone to check my site www.vinceandcarla.com

bizwhiz said...

Hi vinceandcarlaplus

This seems to be a known problem in IE7. Let's hope MS will do something about it.

dm said...

OK your advice seems to work for most people, unfortunately it doesn't work for me...

I'm assuming it's because I'm having my custom domain name forwarded (cloaked) to my blogspot address. Right?

I used to have my own Favicon but it has now been replaced by Blogger's "B".

Any idea how I can display my own Favicon keeping in mind my custom domain name is cloaking the blogspot address?

I thank you in advance.

Regards,

bizwhiz said...

Hi dm

You can let us have your blog url if you want us to take a look.

Anna said...

thanks for this!
dm - i'm doing the same thing as well (using my own domain) and it seems to be working fine.

Flickzzz.com said...

Hey!
Thank you for this advice!
At first I couldn't find where to put that favicon link, but then, accidentaly, I found it's on the very very top of the code...
Works just fine!
Take a look-
flickzzz.com

Ralph said...

First I just wanted to say that your site has been extremely helpful, it's making the setup of my website much easier.

I wanted to know if you had a solution to my problem. I have a favicon that is hosted at myfavatar and inserted the code into my blogger site. The favicon shows up and works perfectly fine if the site is accessed through its www.xxxxx.blogspot.com address. However, I have the site forwarded to the blogspot address from its www.xxxxx.com address, which I purchased from godaddy. The site is forwarded and masked with the www.xxxxx.com address, but the favicon does not appear when accessed through the main, forwarded address purchased from godaddy.

Was wondering if you knew a way for the favicon to show up on main address (that fowards to the blogspot address)

bizwhiz said...

Hi Ralph

If you are able to upload files into the root directory, upload the icon
and name it favicon.ico The url of the icon should be:- www.xxxxx.com/favicon.ico

Master Jiraiya said...

it works woth animated gif too.. i thought i wolud'nt .. so i give a try and.. WOW..!! it really works.. thanks man..

Grace Anne said...

I came across your blog while trying to troubleshoot a problem I am having with NOT seeing my favorites icon on my personal website. I, too, use URL forwarding to my website: www.mydomain.com is forwarded to http://mysite.verizon.net/mywebsite. If I enter http://mysite.verizon.net/mywebsite in my browser, I see my favorites icon. But if I enter www.mydomain.com I don't see it.

I put the link statement in the HEAD section of my index.html page. So how do I get it to work with the URL forwarding?

Thanks,
Grace Anne

MindFul MiMi said...

Hi BizWhiz,
I did exactly what you said for both my blogs and it worked on both yesterday. Today it doesn't work on one blog (http://mindfulmimi.blogspot.com/) anymore. Any suggestions?

bizwhiz said...

Hi Grace Anne

We mentioned external domain sites in our article. However, as we had pointed out, what we wrote was based on literature we read from the net and books. We could not test it because we do not have any external domain sites.

You could add the link in both the domains. Alternatively you could upload the image icon into the root directory and the icon will have to bear the URL www.mydomain.com/favicon.ico

If these can't work, I'm afraid you would have to source the net for guides from people who have external sites and are able to link to their favicons.

bizwhiz said...

Hi MindFul Mimi

I am viewing your blog in both IE and Firefox and I can see your favicon. There is no guarantee that the favicon is read all the time in all the browsers.

/''\..cozuni../''\ said...

thanks for that helpful tips..now i can have my own favicon at my blog

BiTeR said...

Favicon worked for me at the first attempt, just following your instructions. Thanks for posting this useful stuff.

Brad said...

Thanks alot for this great tip!
Works great!

Brenda D. Baker said...

This worked great for my site! Praise to the techno gods.

www.TheArtistGrimoire.com

Thanks,
Brenda

Curtis said...

I have found this guide very helpful and easy to follow. Thank you!

ma' said...

i'm having the exact problem as matt's.

whenever i enter the original address: name.blogspot.com,
i get the favicon.

but with my custom domain:
say name.net; favicon's gone.

you said that the favicon must be uploaded onto the root directory, right? can you tell me how to actually upload one?

thank you very much.

Keith said...

Really nice info... I just used this on one of my Blogs that use the New Blogger Templates...

You can also use: type='image/jpg'

For Jpeg's but I Internet Explorer still looks for .ico files and will not display it tho Firefox & Opera will display gif's png's and jpg's...

Scritpz said...

it only read the favicon on the mainsite as soon you enter by a subsite on your post titles it takes google blogger default icon if it's not in browser catch.
I think have to remove the whole blogger meta generator part and replace all meta tags manually. Possible will work only with blogger one (not the new blogger).
Leechermods.blogspot.com

Anika said...

I have my own domain and I oploaded the picture there are followed all the instructions, I thought it wasn't working because I couldn't see my icon however after reading IE may not show it I searched my site through Opera and sure enough it worked! So if anyone else out there tries and thinks it;s not working and your using Internet Explorer try another browser :)

Thank you guys for the info on how to do this

Renge said...

thx, this is very useful for me.

tierracustica said...

I have a Favicon because of you.
Thanks for all your help, I really appreciate your tips, greetings from Costa Rica.

Dv0rsky said...

You guys rule!

I tried many times to install this favicon to my blog, but all the tips were either too complicated for me, or I was too lazy :)

But your guide helped me really!
Thank you!

Ozzy said...

Damn good site! Couldn't get the favicon to work for the longest time. Then I changed the file name from favicon.ico to another name and it worked. Does that make any sense? Would google pages not accept the file because it was called favicon?

Jennifer said...

Thank you so much for this post! I just found your site and it is so helpful for people like me. I was having problems but I just scrolled through your comments and you answered it with someone else's problem! Thank you!

Brisbane Computers said...

I am all new to this custom blogger and it is great!

I am using Internet Explorer and don't know if it has worked properly. I can see the internet explorer favicon so I know it has taken the blogger one away.

Can someone look at www.experimentttggg.blogspot.com

pınar said...

i have tried this many times, some favicon codes for blogger aren't workin'. but this one did it well. thanks a lot for the info. :)

VijayaraghavanP said...

really good post, it is very much suitable for a novice.. works for firefox as well as IE7.. thanks..

http://newzntrends.blogspot.com/

Kuuipo1207 said...

First of all, I must say that for the past two days I have been eating up all of the great information you have offered on your site! Thank you so so much for taking the time out to do all of this for us noobs.
Second of all, this worked great! At first I was having some difficulties, but noticed that someone else left a comment that was having the same problems. I followed your suggestions for that person, and now I have my own icon!
Thanks again!

Here's my blog if you ever get any free time to check it out! :)
http://kuuipo1207.blogspot.com

pam prussel said...

I was just directed to your blog after asking another blogger how they created their favicon. I did everything easily all the way up until I had to add edit the HTML. I have tried to use your code esactly as shown. I have also tried adding www. after http://.

and both times i get this message:

Your template could not be parsed as it is not well formed. Please make sure all XML elements are closed properly. XML error message: The element "link" must be terminated by matching end tags.

I have tried to change the end tags and it allows me to but then the only thing that shows up is the HTML code above the nav bar. The favicon does not show up.
Help!

Linus Rylander said...

This stuff is great. Just like someone else did, I was googling for this info. Thanks a lot mate!

I'm gonna do this right now for my own blog about self development.

http://lemonary.blogspot.com/

Game Theory Online said...

Thanks for this, looking forward to trying it on my Video Game News blog http://gametheoryonline.blogspot.com

Bryan said...

how do you get your favicon to show up in RSS readers?

Marcelo said...

OH THANKS! I was trying to make this for years! The explanation is clear, the solution its REAL. THANKS SO MUCH!

Nat@London Calling said...

So simple, yet so effective!

frnz said...

your post about how to put a favicon and a scrolling text marquee was really helpful..thanks man..

Miles said...

Judging from the comments, most people have been able to add their favicon successfully, but I just can't seem to make it work for me. After following your instructions, my favicon appeared, but then disappears after several weeks. I use Firefox and do not regularly clear out my cache. What might I be doing incorrectly?

Ana said...

I followed the directions and hosted using Google pages. The favicon shows up just fine when the page loads, but I can't see it in the bookmarks list. I'm using Mozilla. Can other people see my icon in their bookmarks list? I saved it to a 16x16 size. Thanks for the easy directions! I really love your site.

"WiCkEd-WaYz" said...

Great post about the favicon. Works perfect and shows up right away.

Nicolae CIOBANU (jr.) said...

Yes! Great explications! I understand it easy and all, and it works ok.
For all the guys/galz above who don't have a program to make .ico, just do the following: open MS Paint, make image size in Attributes 16 x 16 pixel color; put there your drawing (my case) and when ready save as .bmp *(you can always use the program mentioned here, or Photoshop, and I will); go to the file and rename favicon_name.ico. Just that!!! It works!
Of course, along with the addition of code to the blog(ger) page, you have to host the file. I tried on geocities (i had there a site), the i saw there a link to Y! Passport, where I can put a load of items, including the favicon.ico (which I did!). A big thumb up to the author!!!!! And also, a great great site!
Just IF you have time, please look at my blogs: agenda-mea.blogspot.com and e-istorie.blogspot.com (I am the admin, the first is mine, the second is on m,ilitary history; it's true they are in Romanian language, but just take a look and pleeease comment!). Thanks! :D

Miles said...

hello..

your instructions seem straight forward enough, and i've followed them as directed, resulting in a favicon is added to my blogger site! however, it then mysteriously disappears after several days with no tampering on my part. why is this and how can i rectify it? thanks.

Friends of English Martyrs said...

I think I've done everything properly but my favicon isn't showing up. I just get either a Blogger favicon if still logged in or an ordinary IE favicon if I'm not. Can't spot what I've done wrong, can you?

Fiona1 said...

Have been trying to upload favicon into googlepage creater and pasting the url in the code as you said.

Its not showing. I´m viewing it with IE but i dont think it´s the browser as I can see your blog´s favicon as clear as day. How did you manage to do it?

José Gil said...

Hello m8. Gratz from the West Coast!!

I love your site because it is a great help. Until now...

I tried to put the favicon on my blog and... nothing

http://aventurasemportugal.blogspot.com

Tell me what to do

Gil

Blog Crazy said...

Thanks a lot..........but I dunno why the "former" which u recommended is not working{some error msg which I couldnt understand}while the latter works fine :)

Mom2Cam...Wife2Ger said...

I did this about 2 weeks ago and it worked fine...now all of the sudden its not working/showing up anymore. Do you know why that would happen???

Thanks
Sandra

Lady Vankovic said...

I love you so so so so much. Everything i do for my blog came from two websites. one was yours and the other was beta blogger for dummies. But still.. you guys rock!!!!!!!!!!! u have to check out my website. I would be honoured

www.ladyvankovic.blogspot.com and www.rocktheworldforchrist.blogspot.com

thank you thank you thank you

Fruitful Vine said...

I love your blog it is so helpful. I have been able to do quite a number of changes to my blog because of your help. Thank you very much. I just added a favicon using your step by step instructions. Your blog is really great.
Jenn

Chuckleloo said...

hi! thanks for all the tips on blogging! umm...about favicon...i did everything instructed on your post i use mozilla firefox and definitely not I.E. the orange blob icon doesn't appear beside the URL instead, a white paper icon appeared!! i need help! please comment replies on this URL:

http://cps-clubpenguinsociety.blogspot.com/

AnimeFreakz said...

Hi bizwhiz, thanks for the clear instructions. It work but only on the main page. Why is that? I only bought domain name and my blog is still hosted at blogger.

http://www.animexon.com

Nia Saransi said...
This comment has been removed by the author.
George said...

Hey I have my blogg at fitnesswonders.com and for some reason I can't get this to work thanks for all your help excelent site

krishna said...

hey..thanks a lot...this one was really useful..!!!

Anonymous said...

Hi. You're heaven-sent! It works great on Mozilla. Having a bit of problem on IE though. I know you said there'd be compatibility issues, and even yours doesn't show on my Address bar -- but it DOES show on my bookmark list once I've bookmarked it. Mine doesn't though. Help? Please? Cheers.

hee-haw said...

May i know how to add a page element below the post?

Sherin Devassy said...

Excellant article. Really appreciated for the tip.

Keep it up with lots of fantastic stuff like this...

Very useful and well defined. It worked with first setup itself.

Thanks a lot
Sherin

R.John Christy said...

Thanks. It is working. I have created the image @ http://www.freefavicon.com/index.php . Could not able to edit the template using their instructions. But yours working Great. Uploaded image @ Yahoo Geocities & using at my blog www.investchips.com.
Thank you very much.

Nazmul Kabir said...

Hi!

I just tried u'r Favicon tips. But it didn't work in my browser (Opera 9.5)!

Iceman said...

Something I have been trying to do since January 2007
http://justguru.blogspot.com/

Thanks to you...I am now done!

I have uploaded something just for the sake of it...soon I will replace it with something cool!

Thanks man...you will go places!

Clifinar said...

Hi, This is working great and looking very nice on my clifinar blog. Thanks!

KPI LIST said...

Thanks for the tip, i used this method with google page creator for the following KPI List

Gredie said...

Thanks so much for the post. I am having one problem though. When I'm signed in to blogspot and then view my blog the favicon is there, but when I just go straight to my blog it doesn't show up. I'm using the latest version of Firefox so am a bit confused as to why it's not showing up. Any suggestions?
www.gredie.blogspot.com

Warrior In Scrubs said...

Hey, thanks to this great post, I was able to place the Philippine flag as my favicon. :)


http://warriorinscrubs.blogspot.com

MUA in Scrubs said...

yey it worked! i used fasterupload.com.. thanks a bunch!

AsSphere said...

what a good guide.. thank bro.. u can see at my blog http://assphere.blogspot.com/ the icon has been change..

Mark said...

Thanks for this tutorial, it's really help me a lot.. :)

---------------------------
http://www.free-bie.co.cc

Enjoy! said...

Hi! Thank you so much nice tute and nice blog. i have added favicon to my site http://visitenjoy.blogspot.com

Maddie Dean Photography said...

I'm an HTML idiot and this worked like a charm! Thanks for such comprehensive tutorials!

-sarah-

Junior said...

Works P-to-the-E-to-the-R-to-the-F-to-the-E-to-the-C-to-the-T!!!

Juniorama.dk now has favicon... :)

Catharina said...

Hi, this blog is a great help. I do believe I am now the proud owner of a favicon! Wasn't easy, Google Page Creator and Photobucket wouldn't host my test images after I'd transformed them to the ico format. Finally I found an online service which both transforms and hosts, it's called iconj and it seems to have worked for me - although my favicon appears very randomly, but I suppose that's a browser problem (yes I have IE). Thanks so much, I wouldn't have known where to start without this blog. Here's the site I mentioned:

http://www.iconj.com/icon_generator.php

I copied and inserted the generated code (link) in its entirety, where you said.

Thanks!

NoX said...

Simple, clear and great tutorial.
Thank you very much!!!

Anonymous said...

amazing guide how did http://blog.lanthaler.org manage it? it shows a new favicon for every page

Andrew Chua said...

great post! failed to understand so many others but found the answer here!

Thanks!

conflictedthimble said...

i love your site but had a problem with this favicon thing - it worked great yesterday, and now it's gone today. i double checked the code, the info is still there, why won't it show?

conflictedthimble.blogspot.com

thanks for any help...

akituai® said...

Dear fren...

thanks for the great tips...

its very work for me...

foobella said...

Googlepages said it's not accepting new sign-ups but they now have http://sites.google.com and that worked like a charm for me!!

This blog has helped me so much and it's so easy to follow for this non-html knowing girl.

Thanks.

Taedium Vitae said...

teşekkürler. (turkey)

Kuan Yew said...

Hi, First and foremost, this is an awesome site!

but I need your help here.
After customizing my own image and converting it into .ico using the icon creator from dynamic drive and hosting it as google groups,

I edited the html template as instructed but was unable to save it after replacing the 'url of iamge file'.

the error message reads

"Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The reference to entity "gsc" must end with the ';' delimiter."

your help is much appreciated!

Manager said...

I have a big problem with this.

I did everything you told me to do and i generated the favicon to google pages.

I copied the code to and put it on blogger with the URL of my icon. The URL is right and everything but when I click preview on blogger, it tries to close the page. It also gives me a message like this:

We were unable to preview your template
Please correct the error below, and submit your template again.

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.

XML error message: The reference to entity "gsc" must end with the ';' delimiter.

I dont know whats wrong. Is it my template, or am i doing something else wrong?

P.S.
The URL of my favicon is:

http://samplegroup58.googlegroups.com/web/favicon.ico?gda=c9EjJj0AAABcyKJnx9HMeeJOfjH-4wgHXeHfxZdb77YFSWwGZLGCCb6arY5c6iP35YmpztcKmoDlNv--OykrTYJH3lVGu2Z5&gsc=JXIPARYAAAAVzKSx7Z1v72OLzL2h110qS7ibph5ftdNh9K_-frBgDg

Thanks,
-Manager of Boston Bruin Fights

Manager said...

Nevermind man, I got the favicon working and it looks great!

Thanks a lot!
Manager of Boston Bruin Fights

mift4hhurrahman said...

Hi mr...
my name miFtahhurrahman from indonesia..
i glad to see my blog now have a different icon (not blogger icon anymore)..

Your article is useful because i have read all of post about how to add favicon in blogger and all of them is fail..except you..

Thanks...

Mithya said...

I've been trying for hours to change my icon blog. And the other websites are not working with my blog. They keep on telling me to put it under the "head" code

But yours works in an instant! thank you!

Tommy 少侠 said...

Thank you for the tips! It works in my blog! :D

Ain HD said...

Thank you! Perfect!

UFO Blogger said...

Instead of pasting the given code next to - head

You need to past it next to - /head

Its work like charm

and now you may ask why like that?

because blogger have two version of blog template

1. Classic blogger template [Old One]
2. Present one which most of us using now days !!

So

Classic blogger template paste next to - head

And 4

Latest blogger template paste next to /head

Have great blogging

UFO Blogger

Deepak said...

Thank you for this post because i was searching for this type of post and i got it from your post.I will place a favicon for my blog and i have a request if you have any idea to place a link of mine in your blog in exchange of your which i will place a banner and description in my blog link to you.Just visit and see.Please.

Add Blog Banner

JayGal said...

Worked fine.

BTW I got my favicon from http://www.favicon.cc/
you get animated ones here for free
& uploaded it to http://www.oogletoogle.com/ (no login required)

Thanks.