Saturday, January 23, 2016

Beautify Your Blog- Custom Favicon

     Ok, so I LOVE the internet!  You could almost say, it's an addiction.  And with that addiction comes the compulsion to have one hundred of my most favorite tabs open… at all times.    Yea, my husband loves this about me! :(

     What makes me even happier in all my  tab bliss is when my tabs have a custom favicon. It makes it so much easier to quickly find the tab I'm looking for

     You know a favicon?!  That teeny little squares with the brand’s logo… mini-sized right next to their name on the tab!

     Anyone can do this.  If you can crop and upload a pic (use picmonkey) , then you can do it.  :)

Step 1) Decide what you want your Favicon to be.  This is a SMALL, SMALL pic we’re talking about here, so it needs to be something fairly cropped and zoomed.  Otherwise, no one will even be able to tell what it is.   One idea is to take the initials of your blog name, or even the first letter.  I chose to use the a crown since it’s the graphic image of My Charmed Story & Team Charming!

If you have a graphic in your header or blog button, that might be a good choice for your favicon.

Step 2) Crop out your favicon image. Here’s a little secret… I found my free image with a transparent background on google images.  Then, I edited my image on  I have read several blogs where they create their image using Microsoft Word.

Step 3) Resize to a micro mini square.  It’s got to be perfectly square and it can’t be bigger than 100 KB.  Upload your favicon in Picmonkey to resize appropriately. Or, if you created it in Picmonkey, just change the image size.  I read that  you want your favicon to be 32×32 pixels instead of the previously accepted 16×16 pixels since computer screens are getting bigger and bigger.

Once you’ve resized, you can even add rounded corners in picmonkey if you desire.  Then, save as a png file.  

Step 4) Upload to blogger. Go to design, then on the left you’ll see the favicon editing area.

Click choose file and find where you saved your resized version.  

Save and you’re done!  

If yours isn’t showing, try restarting your browser and/or your computer and see if that gives it the magic touch.  :)  You can also do something called emptying your cache and clearing your cookies too, and you probably can google to figure that out too.  :)

LSP Signature

No comments:

Post a Comment

Thank you for taking a look at my blog and leaving a message!