DIY Favicon creation for your blog | Blogtrovert

DIY Favicon creation for your blog

May 28, 2017Joseph O.

By right, you should know what a favicon is if you use blogger. It’s definitely recommended though not forced on you.

Having a favicon makes your site more professional and unique. At least you need to change the default favicon from the ‘B’ logo as implemented by Google on all blogger blogs. Your favicon distinguishes your blog or website from others.

Since there are lots of free favicon creation sites, creating a favicon shouldn’t be neck breaking, but there is always someone in need of some help, which is why this post has to come to light.


Before you start creating your favicon, as always, you should consider your site design. Don’t go off colours!

Your icon should be square in shape, resized to 16x16px and shouldn’t exceed 100kb (recommended by blogger).

Brainstorm and come up with the perfect letter or image you’d want to use, although using alphabets is always better because, your favicon will be really tiny!

You can use images, icons, cliparts related to what you blog about or simply the initials of your blog title. If you noticed, I used the letter “B” to create my favicon, which is easier to identify… Go simple, create something that you wouldn’t hate someday and decide to change.

You can use the default image editor in your laptop to create your favicon if you’d love to ‘DO IT YOURSELF’.

How To DIY Favicon

Download a free background image or create one yourself (there are lots of background images online, you only need to Google them).

READ:  How To Create SEO Friendly Blog Post Images That Complements Your Article

Load your image editor, and choose the image you downloaded.

If the downloaded image isn’t square shaped, you can need to crop it preferably to 200x200px so as to inspect what you are creating…

Now add your text and resize it to take at least 95% of your background, You can use PicsArt if you use a smart phone. PicsArt comes with lots of stylish fonts. If you want to use an image, shape crop it so it looks cool. Shape cropping your image will do the trick (square is OK but wouldn’t do justice to your icon if you have a coloured background).

If you are using a text, embolden and design it (change the font style) with your desired colour, preferably one related to the main colour of your blog.

Once you are done creating your favicon, resize it to 16x16px and save. Jpg image formant is recommended.

How to upload your favicon

Visit your blogger admin panel and navigate to layout, click on body the section and click on edit in the favicon block. Image below

Click on choose file to add your newly created Favicon.

Once you’ve added the image, click on save to add your own custom favicon.

Well, in case you’d rather not stress yourself,you can checkout

Did you enjoy this article?

Don't miss out on our new content. Sign Up!

Prev Post

Add a responsive dropdown menu To Your Blog on blogger

May 28, 2017

Next Post

Blogging for Beginners, When is Content king?

June 1, 2017

Leave a comment

Your email address will not be published. Required fields are marked *

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

Subscribe To Our Newsletter

Join our mailing list to receive the latest news and updates from us

You have Successfully Subscribed!