Blog Tip: How to Create a Favicon

By Dana Fox

If you own a blog, or you’re a reader of a blog, you’ve all seen this icon:

This Blogger icon appears in your browser address bar beside the blog URL as well as beside a blog’s name in blogroll lists… Unless you have your own fancy shmancy favicon to replace it!

Look up in your address bar right now. See my little plush deer beside my blog URL?  That wasn’t magically placed there!  It’s super easy to add your own favicon to your own blog in a few simple steps.  Adding a custom icon beside your blog is a great way to add a little bit of personalization to your page, and helps you stand out in a list of blogrolls.  Some of you already know how to do this, but for those that don’t, I’m going to show you how!

First, you’ll need a favicon of your own. You can use an existing photo you took, find a pre-existing one online, or draw your own.

Go to Favicon.cc to make the magic happen! Along the side, you will see that you can “Create New Favicon” or “Import Image”.  If you want to create a new favicon, this nifty little website lets you draw out your own in pixel form. If you’re not that creative, you can upload an existing icon or photo instead.

If you’re using a photo, you’ll want it to show a specific object on a plain background. We can’t get TOO fancy with our little favicons, because they are only 16×16 pixels in size.  So just keep in mind that whatever you create or upload will be shrunken a ton.  Simple shapes like a heart, a leaf, or a letter work pretty well.

Here is what my deer plush looks like once uploaded to the favicon.cc generator:

It may look funny here, but if you check out your browser’s address bar after uploading, it will show you a preview of exactly what it will look like as your icon!

Then when you’re happy with how it looks, all you need to do is hit the Download Favicon button below the generator and save it to your computer.  It will save as a .ico file.

To add this favicon to your Blogger blog, they made it pretty easy for you. In your Blogger admin, just go to Design then right under the line “Add and Arrange Page Elements” there is an option to change your favicon. Simply upload it and you’re done! (In the new Blogger layout, just click the drop down arrow in the menu beside your blog, then choose Layout. There is a favicon edit link right on the next page!)

Happy faviconing!

P.S. Some of you are having problems saying it’s not showing up. It’s nothing you’ve done wrong, it’s just because your computer has cached the old blogger icon, so it might take 24-48 hours or so to update for you… depending on when you most recently visited your blog. Try viewing it from a different browser or try clearing your internet cache to see it immediately!

p.p.s. I can’t reply to some of your questions via email because you have not set up your email address in your blogger account. View THIS POST to learn how to allow replies to your email address. PLEASE DO THIS! I can’t stress it enough :)

p.p.p.s. IF ANY BLOG OWNERS HAVE ANY SPECIFIC QUESTIONS/HELP TOPICS YOU WANT ME TO COVER, PLEASE LEAVE A COMMENT AND LET ME KNOW WHAT YOU’D LIKE TO SEE AS A FUTURE POST! 

linking up with: tatertots & jello


Need blog topic ideas? Check out 365 Blog Topic Ideas on Amazon!

Follow (CLICK TO FOLLOW ALONG AND STAY UPDATED)
Dana Fox
Dana Fox
blog
About me

I am a country loving Canadian with a mind that never sleeps. When I'm not running the Wonder Forest blog ship, you can find me creating artwork for phone cases and home decor, whilst managing the daily tasks of Dana Fox Creative. Visit me at the links below if you wanna be friends!

YOU MIGHT ALSO LIKE

daily-blogging-tasks
My Essential Daily Blogging Tasks
February 05, 2016
Host
How & Why You Should Host a Twitter Chat
January 28, 2016
blogger-failures
6 Common Causes of Your Repeating Failure as a Blogger
January 22, 2016
best-blogging-tips
The Best Blogging Tips Of The Year
December 28, 2015
black-fri-bloggerssm
Exclusive Black Friday Weekend Deals for Bloggers
November 27, 2015
improve-writing
How To Improve Your Writing Skills
November 12, 2015
blogger-to-wordpress
Transitioning from Blogger to WordPress Smoothly
November 03, 2015
blog-wonderful
A Blogger’s Complete Guide to Success
October 27, 2015
Editorial Calendar For Bloggers and Businesses
The Perfect Editorial Calendar Strategy
October 26, 2015
  • https://www.blogger.com/profile/17544718373580541155 Tammy @ Lemons, Avocados, and the Bay

    Yay thanks for posting this. I was actually just about to start researching how to make a favicon :)

  • https://www.blogger.com/profile/01675428820282310551 Irene Wibowo

    nice.. thanks.. :)
    Irene Wibowo

  • https://www.blogger.com/profile/10254941945158664703 lazy explorers

    Ooh! Thanks! I don't really like the one I have now, and I had a really hard time making it. This makes my life so much easier!

  • https://www.blogger.com/profile/18201797370322000117 Angie

    Oh my god! Love this! THANK YOU SO MUCH!!!

  • https://www.blogger.com/profile/14246631668535735534 CrAnKy BaNaNaS

    i "liked" all of these fabulous vendors! what an amazing giveaway!

  • https://www.blogger.com/profile/15541443026764408053 Emily w/Amazing Grapes

    I just did all the steps and it won't show. Its showing saved in my layout but when I bring up my blog it still shows the blogger B next to my name. :( I don't know why it won't show for me.
    Emily w/Amazing Grapes

  • https://www.blogger.com/profile/14505841822166287614 Ms. Givens

    I am gonna do this!

  • https://www.blogger.com/profile/07214719604168475353 Brooke @ Spruce Your Nest

    I am having the same issue as Emily? I have it all saved and it shows on my edit layout, but not when I go view my blog??

    Thank you so much for the tip though…I have never known how to do this :-))

  • https://www.blogger.com/profile/07650587056374483559 Mr. Taylor and his Lady

    adore! i just made one! hopefully it will start working soon!
    xo TJ

  • https://www.blogger.com/profile/08215686333093257599 Vanessa

    Thanks:)
    windytreeowls.blogspot.com

  • https://www.blogger.com/profile/11647520525116180115 Miss Amy

    I made my icon a Pug with a hoodie sweatshirt on. haha!

  • https://www.blogger.com/profile/16681827201532364565 Haylee

    Hello, first of all, I REALLY appreciate this post, I've always wanted to learn how to do this!

    Secondly, I'd love if you could explain in a future post how to make one of those "About" sections with the picture and the picture buttons underneath that lead to your other networks. I apologize for not knowing the term, I'm still pretty new to all of the decorative aspects of blogging.

    Thanks! :)

    http;//sugarhistudio.blogspot.com/

  • https://www.blogger.com/profile/18059201574461739410 Mel M. M. McCarthy

    Thank You so much for sharing how you made your favicon. That little dear is so cute! I can't wait to try making something of my own.

  • http://profile.typepad.com/6p0147e2fbb6e3970b Candice

    Thanks for this! I'd been wondering how to do it so reading this was great timing :) Really helpful.

  • https://www.blogger.com/profile/03758617648421809682 Jamie

    Awesome thanks so much. I love your helpful bloggy posts. This may seem like a dumb thing to cover but I am completely lost on the RSS thing. I have no idea what it is… if I'm doing it… or why I should be.

  • https://www.blogger.com/profile/14169934945628133136 Funmilayo I.

    Thank you! Awesome tip!

  • https://www.blogger.com/profile/05111249198930353662 Em

    thanks! I always wondered how to do this, I would never have guessed it was so easy!

  • https://www.blogger.com/profile/00887126658723086134 *Helly Dee*

    Sorry to be a pain…I seem to be having a little trouble… I followed all the steps but it won't show. Its there and showing in my layout but when I bring up my blog it still shows the blogger 'B' next to my blogs URL. I see the same is happening for others… any idea how to solve this?

  • https://www.blogger.com/profile/12826520553476103759 kellyelizabeth

    I have a problemo. I did all the steps and made one that i really liked. When I try uploading it though blogger says its "not a square image." I tried different pictures and sizes and everything. I dont know if you know anything about this, im just confused. hopefully you can help!!

    -kelly-

  • https://www.blogger.com/profile/10694053434544718106 everything bananas

    i'd also love a tutorial about the about me section and the social network button links. this is awesome thanks so much for all the great tips! Blessings!

  • https://www.blogger.com/profile/10694053434544718106 everything bananas

    i'm also totally loving all your tips. so happy to have this blessings to you! …also i'd like the tips on the about me section and the social networking buttons/links too!

  • https://www.blogger.com/profile/10270197134786683416 Jillian

    Hi I would really like to know how to erase the space on my sidebar between gadgets and images. Every article I found said to find .side.widget or something like that and I cant find it!

    I would love to know!

    Thanks!
    Jillian

  • https://www.blogger.com/profile/07663048343388770344 IzabelleLilli

    Thank you so much! This was a great tutorial. I have an Idea for a blog post…. I recently was wondering how to add your own pictures to Page buttons (Home DIY, Fashion,Photography etc.). I can`t seem to do this but I have seen some really cool ones on these websites… http://www.tenpennysplendid.com/
    http://myevaforeva.blogspot.com/
    http://yellowbirdyellowbeard.blogspot.com/

  • https://www.blogger.com/profile/03224242089498741456 Daniela

    Thank you very much! This post is very useful.

  • https://www.blogger.com/profile/06378560785114125772 Ms Bubu

    I wanted to do this but didn'T know how it was called so it was hard to google it. Thank you!

  • https://www.blogger.com/profile/11970427120733944090 kelly thompson

    thanks so much!

  • https://www.blogger.com/profile/06898026605810147529 Nikhil

    Very helpful post. Your blog has got a very good design! I implement your Favicon tips on mine: witheredpapyrus.blogspot.com

  • https://www.blogger.com/profile/13403068891617070698 rebecca-ella

    This is so helpful – thank you! I've been having a bit of trouble with things not being in the centre – what's the correct html code to get your header in the centre, instead of the current default being on the left?

  • https://www.blogger.com/profile/12697089114901065510 Lucy Coles

    I love this post. Very helpful. :) Just wondering if you could tell me how to put a favicon onto a WordPress.org site, thanks

    -Lucy

  • https://www.blogger.com/profile/13061052835388041869 Gemma O

    It worked, I'm so happy! Everyone saying it's not showing up needs to look on another browser or wait a few days like it says on the post

    creamteaandrosejam.blogspot.co.uk