Animated (On Hover) Fixed-Floating Twitter-Follow Me Badge for Blogger

Add This To Del.icio.us StumbleUpon This Add to Technorati Digg This

Login To Blogger Go To > Design > Edit HTML.

and mark the tick box "Expand Widget Templates"

Then, find (CTRL+F) this code in the template.

</head>

And immediately before it, paste this code:

<!--TWITTER-FOLLOW-ME-STARTS-->

<style type='text/css'>

.feedbacktw {

width: 31px;

height: 116px;

display: block;

font-size: 10px;

text-decoration: none;

background-repeat:no-repeat;

background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcouIgKXf1GNyfzgZ6TArBZVVouzN1XWCc7YOCR8honGOGr0mNfmoHtTrGbgInYHSAMqkRLevof_PxzymLIU-c_kqmp1bPxXtaI66z9gWg_4by94pH1Fjoyw5z85KUPGajVX-Socb6kfc/s1600/twitter.png);

position:fixed;

top:20%;

right:2px;

}



.feedbacktw:hover {

width: 31px;

height: 116px;

display: block;

text-decoration: none;

background-repeat:no-repeat;

background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcouIgKXf1GNyfzgZ6TArBZVVouzN1XWCc7YOCR8honGOGr0mNfmoHtTrGbgInYHSAMqkRLevof_PxzymLIU-c_kqmp1bPxXtaI66z9gWg_4by94pH1Fjoyw5z85KUPGajVX-Socb6kfc/s1600/twitter.png);

position:fixed;

top:20%;

right:10px;

}

</style>

<!--TWITTER-FOLLOW-ME-STOPS-Widget-by-http://www.royaltutor.net-->

Now click Save the Template.

Then, Go To > Design > Page Elements.

Simply add a Gadget of HTML/JavaScript type.

add this code in to it:

<!--FOLLOW-ME-STARTS--><a style="display:scroll;" href="http://twitter.com/your profile" class="feedbacktw"> </a><!--FOLLOW-ME-STOPS-->

Change the link in RED color to your own Twitter profile.
Now click save.