Content feed Comments Feed

Creating favicon for your Blog

Posted by Wonderful-Tricks
ADVERTISEMENTS



Creating favicon for your Blog

Have you noticed the animated W icon on this site ??? .Theses icons are called favicons and are present on the extreme left of the URL bar of your browser . Here you can see a screen shot of the Google's "g" favicon that i took from Mozilla Firefox.

Similar to desktop icons these favicons represent each websites & it is the short code for favorites icon . But as far as blogger blogs are concerned, they are having a default favicon built onto them . The following procedure will explain how to change the default blogger favicon with yours . Remember to check the blogger terms and conditions before you change the favicon


  • Go to the Layout and select edit HTML

  • Create a back up copy of your blog by clicking download full template.

  • Now find out following lines code. ( Don't worry if you are not able to find them out just press cntrl+f then search for <head>)

    <head><b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[

  • Next step is to create your own favicon ,for that you may use any image and that to be converted into .ico extension . But remember to make it small, sharp and square shaped so that it is visible .

    To Create Favicon U can use the below sites:
    Visit Dynamic drive
    Visit Animatedfavicon

  • Once it is created, upload it to any photo sharing website like imageshack.us or any hosts supporting icon files.

  • In between second and third line of the code shown above , add below code with necessary editing or just add below <head>

    <link href='Icon URL' rel='shortcut icon'/>


  • Replace Icon URL with your .ico file ( May be like this http://imageshack.us/.../.ico)

    Now save the template & you are done.


Please Make Note:
Don't know how to create an .ico file from your image file?? Well that's pretty easy
Go to Visit IconJ and upload your image files there(jpg,bmp,gif are allowed) . Now they will host it and give you a direct link of the image converted as an icon.

As shown in above steps , replace the Icon url with the link you are getting.

Feel free to leave comments.

Your Ad Here
|

0 comments

Post a Comment

Blogumulus by Wonderful-Tricks

Followers