How to Add Floating Share Buttons to Blogger

Floating social media buttons for blogger and blogger floating widget: The given below are guidelines on how to add floating share buttons to blogger blogs.

Share buttons on blogger help to spread your blog's content on Facebook, Google+, Twitter, Pinterest, WhatsApp, and Telegram social pages.

If the shared post is a good one that gets users attention, then it can be reshared in groups, walls, and pages in the case of Facebook.

After Installing this blogger widget, it appears at the right side of all pages on your blog which is clearly seen by your audience.

The result?

More shares on your blog, which is also a signal to Search Engines that your site contains relevant content since most people won't share content they don't find amusing, educative or informative.

This, in turn, impacts positively on your blog by making it rank higher in a search engine.


When people see that a particular post has gotten many shares, they'll definitely want to read it and also share it as well.


 Let's assume you do have quality content, what happens when it gets shared?

I'll tell you!

Having your post shared by your readers on social networking sites like Facebook and Twitter can be rewarding by bringing traffic to your blog and with more blog traffic, there are higher chances of getting clicks on your ads at the same time improve your Alexa rank.

So you see,

While search engines can give you immense traffic, the same is the case of social networks.

Now that you know why you should use Floating Share Buttons to promote your blog post on a social network, here's how to add one to your blogger blog.

Also Read:    Sliding Recent Posts Blogger Widget 2018
                    Social Media Follow Buttons Widget For Blogger
                    Email Subscription Widget For Blogger

How to Add Floating Share Buttons to Blogger

While the blogger default template comes pre-loaded with share buttons, they are not positioned at the most visible part of your blog.

Other custom blogger templates come with one, but their positioning is what matters.

If you want a share button that doesn't require that the user scrolls first before the widget is seen, floats at the right-hand corner of your blog and moves as the site's pages get scrolled, then follow the steps below to add this Floating Share Buttons to your blog.

The code below is a social media floating sidebar in HTML and Javascript and codings.

To begin,
  • From your Blogger dashboard, 
  • Click on 'Layout'.
  • Next, Click on 'Add Gadget'.
  • Copy and Paste the code below into the text field

<!-- floating page sharers Start Share This With Friends-->
#pageshare {position:fixed; bottom:15%; right:10px; 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;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
<div id='pageshare' title="Share This With Your Friends">
<div class='sbutton' id='rt'>
<a href="" class="twitter-share-button" data-count="vertical" data-via='detutor' >Tweet</a>
<script src='' type="text/javascript"></script>
<div class='sbutton' id='gb'>
<script src=""></script>
<fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='gplusone'>
<g:plusone size="tall"></g:plusone>
<div class='sbutton' id='at'>
<a class="addthis_counter"></a>
<script type="text/javascript" src="//"></script>
<div style="clear: both;font-size: 9px;text-align:center;"> <a href="">Get this</a></div>
<!-- floating page sharers End --> 

  • Save the widget. 

Finally, you can view your blog to see the floating share buttons in your blog's sidebar.

If it didn't work for you, then drop your questions and we'll guide you through the process.

Also Read:    Link to This Post Widget For Blogger
                    Add Stylish Custom Search Box To Blogger
                     How to Add IP Widget In Blogger Blogs


Tech blogger, SEO expert, cryptocurrency enthusiast, and freelancer are the terms that describe me. I'll rather write a thousand words than speak hundred words, and that describes my passion as a content creator.