Badge in the upper corner of your blog

**ovidiuu** · 07-21-2009 11:30 AM

First of all you have to create with a graphic software an image for the badge. I recommended to not be bigger that 150x150px, but necessary to be transparent gif, not PNG. Why? Because IE6 does not handle the transparent png or semi-transparent. and still around 35% of the users still use IE. Then, the image should be uploaded somewhere on the server/internet in order to be accessible trough a link.

Once we have the image, all we need is the code, that will be inserted soon after the opening of the <body> tag; it will be very nice if we will insert this before any div, or HTML elements.

HTML Code:

<a id="badge" href="http://www.yourlink.com" title="put the link title here"><img src="http://www.url-of-the-locatiopn-of-your-badge.com" alt="Blog Badge Name" style="right:0px; top:0px; z-index:9; position:absolute;" /></a>

That's it.

If you visit us again, I will try to male your life easier and create for you a few empty badge just to download and add the text you need on it.