Related Posts Plugin for WordPress, Blogger...

Recent Posts

Your Ad Here

Add Floating social media sharing buttons to Blogger

03:23  Ajith Basnayake  38 comments

It amazing!!! you can get More Facebook fans, Twitter followers within few hours, visit

Best Media Solution

Did You noticed on some  blogs using
How to Add floating social media sharing buttons to blogger? It is the latest trend to get  share your posts all over the world. This is a one way to increase your traffic to blog.  Did you notice on most of blogs using Floating Social Buttons in left side or in right side of the page.here’s a tutorial on how to add a Mashable-like floating bar of social media buttons to a Blogger blog. Here included Facebook Share, Twitter,   Digg This and Google +1 (plus one) buttons in the bar. Each of them comes with a live counters.

















 

 

 I. Step of Adding the Floating Social Buttons buttons

  1. Login to your Blogger account.
  2. Go to Design > Page Elements.
  3. Click Add A Gadget.
  4. In Add A Gadget window, select HTML/Javascript .
  5. Copy the code below and paste it inside the content box. 
 <!-- floating page sharers Start -->
<style>
#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="Get this from amazingeworld.com">
<div class='sbutton' id='fb'>
<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
<div class='sbutton' id='rt'>
<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>
</div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'>
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>
<a class="DiggThisButton DiggMedium"></a>
</div>
<div class='sbutton' id='gplusone'>
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<g:plusone size="tall"></g:plusone>
</a></div>
<div style="clear: both;font-size: 9px;text-align:center;"><a href="http://www.amazingeworld.com/2011/06/how-to-add-floating-social-media.html">Get this</a></div>
</div>
<!-- floating page sharers End -->
    Enjoy with sharing!!!
    It amazing!!! you can get More Facebook fans, Twitter followers within few hours, visit

    Best Media Solution

    Posted in: , , ,

    38 comments:

    Thank you for your great sharing.

    BYE

    I will try with this code to share my blog.

    Thankx

    Thank you. it's working fine.

    Thanks! These are some very useful tips! :)

    This share bar looks awesome! Thanks for share!

    thanks - about to try it out!

    Thanks - I also shared your link on my facebook - I think some of my fb friends will appreciate it :) You're an angel!

    thenkiyu ini yang lagi saya cari. makasih ya buat yang punya blog ini ..

    tapu pas di pasang koh malah berada ditengah yak.. jadi ngeganggu blog,,

    thnx buddy...
    applied to my blogger blog...

    and what a coincidence.
    mine blog design is also the same as yours.

    How do you put this on the right side of the page?

    Awesome instructions - thank you! Do you know what code I would use to add a Pinterest share button to this?

    This is great, thanks so much. Is there any simple way to add LinkedIn to the floating bar. I have minimal coding expertise, so if it's too complicated, it'll prob be over my head.

    i was looking for this long ago
    i'd love to ad this to my blog
    thnx

    Everything in one

    Awesome post ,thanks for sharing this its very helpfull.

    I love this, and I'm currently using it! The only thing that would make it better is if Pintrest was added. Do you have a code to add Pintrest?? I would LOVE to have it.

    worked awesome! Thanks a bunch. Love it

    Thanks so much for sharing!

    it works. .Thanks a lot dear

    Nice post to add a floating share button to blogger.

    An easy tutorial to add it.Thanks

    Thanks bro..It works great.Made my day

    I implemented it and it works however the button appears just right after my post (like after the last word) or the other variation under the post title...
    How can I add this button next to my "share bar", the part you can click to leave a comment, you see the labels etc...

    one thing can you add facebook like button in this

    Thank you. It is really work for my blog.

    Hi . I found your web site by way of Google at the same time as searching for a similar subject, your website came up. It seems to be good. I`ve bookmarked it in my google bookmarks to visit later..thank you for your article..i’m very interested. keep up date articles.

    We're a group of volunteers and starting a new scheme in our community. Your site offered us with valuable information to work on. You have done a formidable job and our entire community will be thankful to you.
    Feel free to visit my web site :: Data Recovery Brooklyn

    Post a Comment

    To get Latest Updates Free.

    Enter your email address:

    Delivered by FeedBurner

    Twitter Delicious Facebook Digg Stumbleupon Favorites More