If you look at your left side on this blog, you will notice a vertical bar with some familiar buttons that is following you when you are scrolling your mouse up and down. These are social media share buttons, which usually appear fixed in a spot on a particular website or blog. Due to it being able to “move” up and down like floating in the air, hence the name Floating Social Media Share Buttons. I am going to show you how to add this to a Blogger blog.
[Read also: Pinterest – An Online Pinboard Social Media]
Add Floating Social Media Buttons to Blogger
Why Use Social Media Share Buttons?
You will definitely see social media share buttons on most websites today. It is very popular because webmasters and bloggers will get more traffic with it. Share buttons like Facebook Share, Twitter Tweet, Digg This and Google +1 boost traffic back to your website. It makes it easier for visitors and readers to share your content to their friends and to all over the world.
[Read also: How Social Networking Can Help Your Brand]
Steps To Add Floating Social Media Share Buttons To Blogger
- Login to your Blogger
- Go to Design > Page Elements
- Click Add a Gadget
- In Add a Gadget window, choose HTML/Javascript
- Copy and paste the code below into the content box
- Click the SAVE button
.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=”Share this”>
<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></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>
</div>
<div style=”clear: both;font-size: 9px;text-align:center;”><a href=”http://www.computerhowtoguide.com”>Get This</a></div>
</div>
<!– floating page sharers End –>
Next, view your blog. You should be able to see the floating social media share buttons on your blog page. That’s all there is to install share buttons on your Blogger blog. Have fun !
[Read also: Do You Like, or +1?]
