Monday, August 24, 2009

Fav Icon & the Blogger Nav bar

Share Orkut

You might want to bookmark this page if you plan to start a blog or a website, or this might be already be useful if you are having one.


1] Favorite Icon:


Check out the tiny image of my Unicorn logo, on the left corner of the tab and also on the left part of the address bar. By default when you create a blog or a website, the favorite icon or fav-icon is mostly the logo of the hosting company, for blogger accounts it's the blogger logo which is the default fav-icon.


So, how is this changed ?

Finally it's a pretty simple one line code


<link href='url of your image in png or gif format' rel='shortcut icon' type='image/png'/>

[paste the above line immediately after the <head> tag] [if using .GIF instead of .PNG image, replace png with gif in type='image/gif']

Note: Any image should not be used for the fav-icon. Take care of two basic rules.

  • Keep the format as .PNG or .GIF, these formats keep the image size small.
  • A image of resolution 16x16 or 32x32 is preferred.

If you are creative enough, you could even create an animated GIF to be used as a fav-icon, but the only problem in this approach is that the animation is visible only in Firefox browsers. In most other browsers only the first image in the animated GIF is shown.


2] The Blogger Navigation Bar (nav-bar)


So you have made a blog with blogger.com, you made your first post. Everything is working fine, but you don't like the navigation bar that blogger.com has provided, you feel no need for it.

There is a simple CSS for achieving that.

<style type='text/css'>#navbar-iframe { display:block }</style>

<style id='page-skin-1' type='text/css'>

#navbar-iframe {

height:0px;

visibility:hidden;

display:none;

}

</style>

[place the above code in the <head> section of you blogger layout-html]

I am not sure whether removing the Navigation bar is against blogger rules, be sure to read them before you do anything, don't do anything stupid if the rules do say that the navigation bar may not be removed.

0 comments:

Post a Comment

Write your comment here