Dynamic Floating Social Bookmark Widget For Blogs

Blogger Widget,How To,

Rate this posting:

{[['']]}

Add This To Del.icio.us Tweet/ReTweet This Share on Facebook StumbleUpon This Add to Technorati Digg This

As we all know social sharing is the key to success. And if we add social sharing widget to blogs than we get a large amount of unique traffic to our blogs. As more and more readers will come. So, today we are going to add another beautiful Dynamic Floating Social Sharing Widget To blogs. Floating Social Sharing Widget is a widget which float along with the blog. It contains various social media like facebook, twitter, pinterest, google plus. Here is the snapshot of the dynamic floating social sharing widget:

Add Dynamic Floating Social Bookmark Widget For Blogs

• Go to Blogger Dashboard>>Template>>Edit HTML
• Now press ctrl+f and find </head>
• Now above </head>, paste the given code below:
  

  <script src=' http://ajax.googleapis.com /ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script language='javascript'> var name = &quot;#floatMenu&quot;;var menuYloc = null;$(document).ready(function(){menuYloc = parseInt($(name).css(&quot;top&quot;).substring(0,$(name).css (&quot;top&quot;).indexOf(&quot;px&quot;)))$(window).scroll(function () { offset = menuYloc+$(document).scrollTop()+&quot;px&quot;;$(name).animate({top:offset},{duration:1000,queue:false});});}); #floatMenu { position:absolute;top:150px;float:left;width:45px;}#floatMenu ul {list-style: none;}#floatMenu ul li a {-webkit-transform:scale(0.6);-moz-transform:scale(0.6);-o-transform:scale(0.6);-webkit-transition-duration: 0.5s;-moz-transition-duration: 0.5s;-o-transition-duration: 0.5s;opacity: 0.8;}#floatMenu ul li a:hover {-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);opacity: 1;}</style>

  
  
• Now again press ctrl+f and find </body>
• Paste the below code above </body>
  

  <div id='floatMenu'><ul><li><a href=' http://facebook.com/widgetforblogs' target='_blank'><img border='0' src=' http://1.bp.blogspot.com /-q_c63EIPwvc/Ufp6-Lqq-SI/AAAAAAAAAyI /cxu_V8lq2d4/s1600/btrix-facebook.png' style='margin-bottom: 3px;' title='Follow Me On Facebook'/></a></li><li><a href=' http://twitter.com/widgetforblogs' target='_blank'><img border='0' src=' http://1.bp.blogspot.com/-Ri-7SGNYi4g /Ufp6_JEDjwI/AAAAAAAAAyc/njCf0rM4Pd8 /s1600/btrix-twitter.png' style='margin-bottom: 3px;' title='Follow Me On Twitter'/></a></li><li><a href=' http://pinterest.com/widgetforblogs/' target='_blank'><img border='0' src=' http://2.bp.blogspot.com/-dnCnja4wy4o /Ufp6-BBEAFI/AAAAAAAAAyE/HlxF_4fsmfk /s1600/btrix-pinterest.png' style='margin-bottom: 3px;' title='Follow Me On Pinterest'/></a></li><li><a href=' https://plus.google.com/widgetforblogs' target='_blank'><img border='0' src=' http://3.bp.blogspot.com/-Nq0gUA1g15s /Ufp6-IRYyOI/AAAAAAAAAyU/KzTZPUvpZ3M /s1600/btrix-googleplus.png' style='margin-bottom: 3px;' title='Add Me your Circle'/></a></li></ul></div>

• Now find "widgetforblogs" and replace it with your respective ids and save your template.

HAPPY BLOGGING!

Get Free Updates in your Inbox

Follow us on: