WordPress tips: Floating feed subscription icon

Do you notice feed subscription icon at the top left corner of my blog? As you scroll down this blog, it moves along too. Here is the few steps taken to realise this cool "effect".

1. Add the following CSS code into your CSS file.

Code:

#mini-nav { width: 20px; position:fixed; top: 180px; left:5px;} 
* html div#mini-nav { width: 20px; top: 180px; left:30px; position:absolute; } 
#mini-nav img{ margin: 0px; } 

2. Put the following HTML code whenever you want it to be appeared. If you it to be in every pages of your blog, you might need to put the code into few files in your current theme directory (e.g. index.php, category.php, page.php etc)

Code:

<div id="mini-nav"> 
<a href="http://feeds.feedburner.com/YourBlog" target="_blank">
<img src="http://www.yourdomain.com/images/feed.png" 
alt="Subscribe Me!" title="Subscribe Me!" /></a>    
</div> 

Note: Change your feed URL and your image path accordingly and you are done!

Credit to: Cypherhackz

Technorati Tags: wordpress tips, feed