Create A Favicon!

Create A Favicon! | Bonjour, Blogger! image 9
This post was published 7 years ago. Some things may have changed since then - use the search function to see if anything has been posted since then, or reach out to us on Twitter if you'd like to see a more updated post!

Look up! See that little B next to our URL? (Honestly, it is a B) That’s a favicon.

Favicons are another way to brand your blog a little bit more. It’s a tiny icon that identifies your URL as being yours. They’re super simple to create, and pretty easy to install – depending on your blogging platform. It can be as simple as dropping the file in your root folder if you’re self hosted (the root folder in our case would be the one where points to.) We’ll talk you through the making of the icon, then we’ll explain the different ways to install it. (Side note if you’re a user – you don’t need to make the favicon. Just find a square image in PNG or JPG format that you want to represent your blog)

We used a site called to make our favicon – you have a choice between uploading your own image or drawing something yourself on the pixels provided. It’s best to keep this simple, because it’s so tiny. We chose to upload an image containing the B in our logo, then filled in pixels where needed. (Because it’s scaling down a large image into such a small space, sometimes pixels might be missed out so you might need to fill in the gaps!) You can even make your favicon animated, although that was a little more work than we could be bothered with!


Once you’re done, scroll down the page till you get to this view.


Check that the icon looks how you want it to, then click download. This will save a file to your computer called favicon.ico.

Now, to install! Skip ahead to the heading that relates to you…

Self hosted WordPress

You’ve got the easiest version here! Log into your FTP and head to the folder where you upload files to be seen on your webpage (the root folder). Upload your favicon.ico. That’s it! There are some WordPress themes that have this part built in – head to appearance > theme options, and upload the file in the correct place – here’s what ours looks like.

Blogger (

It’s not too difficult to upload your favicon to Blogger, it’s just a little more work than just uploading it to the right place. Head to your dashboard, then to the layout section.


Click on the “edit” link on the favicon and the following pop up will appear


Click “Choose file” and navigate to the favicon that you saved earlier. Click “Save” and that’s it! doesn’t really do favicons. They call them blavatars (a mash of blog and avatar) and these will appear where a favicon would, but also if you link to other peoples posts (a pingback) or like another WordPress blog post, it will appear there as well. You’ll want an image that’s at least 128 pixels square (which can be bigger – you’ll have the ability to crop it later). Head to Settings > General


In the top right corner is the blog picture/icon box (as below).


Choose the file that you want to represent your blog, and click upload. The next screen that will show up is the below one where you’ll be able to crop your image if needed.


Click “crop image” and the image will be saved – see, there’s the new icon up in the top navigation bar already!



  • Kylie

    Oooo this was really handy, thanks! May have to try it out

    May 29, 2013 at 7:45 am Reply
  • Katia Audrey

    Thanks, really helpful! I did it, however it doesn’t appear…have any ideas why?

    January 3, 2014 at 12:05 pm Reply
  • Katia Audrey

    It’s ok, I cleared the cache and it works. Thanks for sharing!!

    January 3, 2014 at 1:00 pm Reply

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: