Post Author : Paul Francis
A floating image is an image that will always appear in the corner of your blog even when you scroll up and down the page.In this post i will show you how you can add a fixed floating image to your blog.The image will also be a hyperlink so people can click it and go you any page you want.You may wish to have an Rss Icon for your feed or a link back to your blogs home page.
Live Demo – You Can See An Rss Image In the Top Left Corner Floating Image Demo
Add Fixed Image To Your Blog
1.In your Blogger dashboard Click Design > Edit Html > Tick The Expand Widget Templates Box.
2.Find the following piece of code in the html:
3. Copy And Paste the following code directly Above / Before ]]></b:skin>
inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth – offsetWidth);}
Note – You can change the following attributes bottom :left to place the image in different corners :
4.Find the following code in your blogs html :
5. Copy And Paste the following code directly Above </body>
<a href=”ENTER TARGET URL HERE“>
<img src=”ENTER IMAGE URL HERE” border=”0″ /></a>
Note – You Must change the following attributes :
ENTER TARGET URL HERE – Place the address you wist the image to lead to when clicked here.
ENTER IMAGE URL HERE – Place the URL of the image you want to use here.
Example : http://i941.photobucket.com/albums/ad259/spiceupyourblog/info.jpg
Add A Second Floating Image To Your Blog
If you want to have a second image you will first of course have it in a different corner but you must also slightly change the code.In steps 3 and 5 change float_corner to float_corner1 for a third image you would use float_corner3 and so on.