Adding a Favicon to a WordPress.com blog

One of the most common questions I hear about WordPress.com is how you can add a Favicon to your blog. If you don’t know what a Favicon is, it is the little image that appears in the browser bar beside your URL or on the browser tab (it stands for Favourite icon). It’s also used to represent your site when someone bookmarks you. The default Favicon on a WordPress.com blog is the blue and white WordPress logo, which can get lost if you have many tabs or windows open. So while it might sound like a small thing, if you want to stand-out from the crowd it’s a good idea to have your own mark.

NOTE: WordPress.com doesn’t use the term Favicon and instead calls it a Blavatar (as in Blog Avatar). WordPress.com also uses the image you upload to represent your blog in other areas other than the Favicon spot. Moving forward I will now refer to this as the Favicon/Blavatar image.

Creating your Favicon/Blavatar image

For best results when creating an image for your Favicon/Blavatar keep it square and clean. I found that using an image 300 x 300 pixels gave me great results (a Favicon is only 16 x 16 pixels, but since WordPress.com will use the image elsewhere you want it to be a bit larger when you upload it).  When I say keep it clean, I mean don’t use a wild drawing or graphic as your image won’t show up properly and will end up looking like a smudge. I went with a simple @ symbol as my image as you can see in this screenshot:

@bamcat Favicon

WordPress.com will only accept a jpeg or a png file as the Favicon/Blavatar image and the file should be as small as possible so it doesn’t slow your site down.

Adding your Favicon/Blavatar image in WordPress.com

1. Under Settings in the WordPress.com Blog Admin section select General.

Wordpress Favicon/Blavatar

2. On the General screen to the right is an area called Blog Picture / Icon. Select Browse to find your image and then select Upload Image.

wordpress-blogpicture

3. Once your image is uploaded you will be prompted to crop it. If you uploaded a square image just select Crop Image without doing anything else.

Wordpress - Crop Image

5. You now have a Favicon/Blavatar image!

Wordpress - All Done

Was this post helpful? Have something to add to it? Leave a comment below, drop me an email at brian@bamcat.com or Tweet me @bamcat.

Advertisements
Tagged with: , , ,
Posted in WordPress
One comment on “Adding a Favicon to a WordPress.com blog
  1. […] starting to play with WordPress.com I’ve discovered many great things about it (and continue to find things I love about it almost daily). One task I was recently […]

Share your thoughts

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: