Awesome Social Media sharing widget for Blogger


We have seen different social media widgets in most of the blogs. A blog without social media is an incomplete blog. For making a blog complete and more advanced, social media is highly required. So, in this post, we will be discussing on adding social media widget for blogger. In this post, we will be discussing on Adding OS X Styled Sharing Widget For blogger. Have you ever used MAC OS X. If you have used, you may find a Desk Like Thing where all apps are placed and when we hover on it, it starts to move. The Widget is same like that.
For Live Demo, you can click below Link:
Or you can watch the picture on the right side.
Now Let's Add This. Follow My Steps To Add This:

  • Go To Blogger Dashboard
  • Click On Layout
  • Click On Add A Gadget
  • Copy and paste the given codes there
<!-- !-->
<style type="text/css">
  #sharedock { position: fixed; bottom: 0; left: 0; width: 100%; height: 90px; z-index: 999; }
  #dock { position: relative; bottom: 0; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; }
  .dock-container { position: relative; background:url( no-repeat bottom center; height: 50px; padding: 20px 0 20px 0; }
  .dock-container .custom_images a { display: block;  position: absolute; bottom: 0; text-align: center; text-decoration: none; color: #333; cursor: pointer; }
  .dock-container .custom_images span { background: rgba(0,0,0,.75); display: none; padding: 2px 8px; margin-left: 17px; font-size: 11px; color: #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
  .dock-container .custom_images img { border: 0; margin: 5px 0px 10px 0px; width: 100%; }

<div id="sharedock">
  <div id="dock">
  <div class="dock-container">

<div class="addthis_toolbox"> 

 <div class="custom_images">

 <a class="addthis_button_facebook"><span>Facebook</span><img src="" alt="Share to Facebook" /></a>
  <a class="addthis_button_twitter"><span>Twitter</span><img src="" alt="Share to Twitter" /></a>
<a class="addthis_button_myspace"><span>MySpace</span><img src="" alt="Share to MySpace" /></a>
<a class="addthis_button_stumbleupon"><span>Stumble</span><img src="" alt="Stumble It" /></a>
<a class="addthis_button_reddit"><span>Reddit</span><img src="" alt="Share to Reddit" /></a>
<a class="addthis_button_delicious"><span>Delicious</span><img src="" alt="Share to Delicious" /></a>
  <a class="addthis_button_more"><span>More...</span><img src="" alt="More..." /></a>

  <script type="text/javascript" src=""></script>
  <script type="text/javascript" src=""></script>
  <script type="text/javascript" src=""></script>
  <script type="text/javascript">
  $(function () { 
  // Dock initialize
  maxWidth: 30,
  items: 'a',
  itemsText: 'span',
  container: '.dock-container',
  itemWidth: 50,
  proximity: 60,
  alignment : 'left',
  valign: 'bottom',
  halign : 'center'
  • Save The Gadget
  • Save The Template
  • Check Your Blog
All Done. If you have any problems regarding this, Comment and I Shall be Helping You.
Happy Blogging !

Share this

Related Posts

Next Post »


August 29, 2018 at 10:49 PM delete

Buy Tadarise 40mg Online is a name for generic Cialis, an erectile dysfunction medication based on Tadalafil. Know about tadarise 40 mg Reviews, uses, dosage, Price , How to take , Side Effect , How to use. cheap Tadarise 40 sunrise. Tadarise 40 for sale Online . Order Tadarise 40 Now !