Float Social Button Tutorial

Assalamualaikum.
Below are step-by-step on how to add social buttons on your blog

1. Firstly :

Copy this code 

________________________________________________________________

<style type='text/css'>

a.linkopacity img {

filter:alpha(opacity=50);

-moz-opacity: 0.5;

opacity: 0.5;

-khtml-opacity: 0.5;}

a.linkopacity:hover img {

filter:alpha(opacity=100);

-moz-opacity: 1.0;

opacity: 1.0;

-khtml-opacity: 1.0; }

</style>

<div style='display:scroll; position:fixed; top:140px; left:-12px;'>

<a class='linkopacity' href='http://www.facebook.com/madihasyafika(link facebook)' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/232.png" /></a><br />

<a class='linkopacity' href='http://twitter.com/syafikamadiha(link twitter)' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/432.png" /></a><br />

<a class='linkopacity' href='http://fikachantalk.blogspot.com/(link blogger)' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/blogger_64x64.png" /></a><br />

</div>

________________________________________________________________

2. Go to Layout > Add A Gadget > Add HTML/Java Script , paste those code in HTML/Java Script

3. Change the red words to wanted link (facebook, twitter etc)

(Optional) 

4. Change blue words to any of your favourite icon, in URL

5. Change green words to any title as tool-tip

The blue links above use below icons:

Good Luck!

Any query or problem, just ask me okay .

Sharing is Caring