How To Add Follow Me Sliding Gadget Button To Blogger or WordPress

Sliding follow button of Facebook, Twitter, Google Plus Pinterest and Subscribe button is now available to add to your WordPress or Blogger website. This is just a simple adding of piece of code to a  widget. Social sharing is must for every website. But have you ever think of following someone you like. Yes ! If your visitor like your post they may want to follow you in Facebook, Twitter, Google Plus Pinterest or Subscribe to RSS feed. This will definitely get you more traffic. So why are you waiting.

How To Add Follow Me Sliding Gadget Button:

For Blogger Blogspot website:

1. Go to Blogger Dashboard
2. Click Layout
3. Hit Add a Gadget
4. Select HTML/JavaScript.
5. Copy and paste The following code.
6. You can add a title if you wish.

For WordPress Website:

1. Go to Appreance
2. Then Widget
3. Add Text. Grab it and put on sidebar.

Code for Follow Me Sliding Gadget Button:

<!--Follow Me Sliding Gadget Button by http://howto.medinfo24.com/---> <style> #wtss{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;} #wtss a{text-decoration:none; font-family:trebuchet ms,sans-serif;} #wtss li{position:relative; height:38px; cursor:pointer; padding: 0 !important;} #wtss .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://lh4.googleusercontent.com/-l0EYSSxxuc8/UFd37FdwjzI/AAAAAAAAG2E/CDbmwPO4haA/s800/sprites.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;} #wtss li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;} #wtss .icon{overflow:hidden; color:#fafafa;} #wtss .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;} #wtss .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;} #wtss .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;} #wtss .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;} #wtss .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;} #wtss li:hover .icon, .touch #wtss li .icon{width:210px;} .touch #wtss li .facebook, #wtss li:hover .facebook{background-color:rgba(59,89,152,1);} .touch #wtss li .twitter, #wtss li:hover .twitter{background-color:rgba(64,153,255,1);} .touch #wtss li .googleplus, #wtss li:hover .googleplus{background-color:rgba(228,69,36,1);} .touch #wtss li .pinterest, #wtss li:hover .pinterest{background-color:rgba(174,45,39,1);} .touch #wtss li .rss, #wtss li:hover .rss{background-color:rgba(255,102,0,1);} </style> <ul id="wtss"> <li data-alt="Follow me on Facebook"><a class="icon facebook" href="http://www.facebook.com/shemul49rmc">Follow on Facebook</a></li> <li data-alt="Follow me on Twitter"><a class="icon twitter" href="http://www.twitter.com/shemul49rmc">Follow on Twitter</a></li> <li data-alt="Follow me on Google+"><a class="icon googleplus" href="http://plus.google.com/101611663127869024919">Follow on Google Plus</a></li> <li data-alt="Subscribe with pinterest"><a class="icon pinterest" href="http://pinterest.com/shemul49rmc/">Follow on Pinterest</a></li> <li data-alt="Subscribe with RSS"><a class="icon rss" href="http://feeds.feedburner.com/medinfo24/FcZw">Subscribe to RSS feed</a></li> </ul> <!--Follow Me Sliding Gadget Button by http://howto.medinfo24.com/--->

You can see, there is all of my Facebook, Twitter, Google Plus, Pinterest and Subscribe link. Change it to yourself. Dont mix up with the code, if you can not change or any problem, feel free to let me know on comment. Thanks

Code Backup

Tagged as: Blogspot Tips, Follow Me Sliding Gadget Button, social button sidebar, social follow button, social follow button on sidebar, social share, social share buttons, wordpress tips