[2] [Tech] [recent] [Latest Posts]

Pages On TechnoPcArea

Powered by Blogger.
if(getTitles) document.write('

Movies of The Week

Join This Site On Google Friend


Collection Of Posts

[5] [Gadgets] [slider-top-big] [Slider Top]
You are here: Home / Horizontal Sticky Floating Social Sharing Widget For Blogger

Horizontal Sticky Floating Social Sharing Widget For Blogger

| No comment
Horizontal Stickt Floating Social Sharing Widget For Blogger

About The Widget

This is a less popular but elegant and very effective social sharing widget.This widget was copied on a lot of sites so I didn't knew by whom was it really introduced but I got the idea of reproducing this widget from makingdifferent.This widget is really useful if you are focussing on social shares of each post on your blog.

Steps To Add It:-

  • Go to Template Tab Of Your Blog's html
  • Click on Edit Html button
  • Search for </head> tag
  • And add the following code above it:-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>

Note:- If you have already added this code in the <head> tag of your html than you must avoid this step.

  • Now search for the following code:-
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'>
  • And if you can't find the above code than search for 'post-body entry-content'.It would be in div tag like it can be in this form:-<div class='post-body entry-content'>

  • Now add the following code above it:-

<b:if cond='data:blog.pageType == "item"'>
<div id='md-active-share-comment-marker'></div></b:if>
  • Now search for </body> tag in your blog's html and add the following code above it:-

<b:if cond='data:blog.pageType == &quot;item&quot;'> <script src='https://ac7fa9ebb6a48ce8479dfa8d93f7c6cec6c6b8ed.googledrive.com/host/0B52nnG4Ig6Fzb2MtT0xPYm5wTVU' type='text/javascript'/> <div id='md-share-window' style='width: 100%; display: block; position: fixed; top: -450px; left: 0px; background-color: rgba(235, 88, 60, 0.8); z-index: 100; padding: 0 0 10px 0;'> <div style='width: 100%; margin: 20px auto;'> <span id='twitter' style='float:left; margin: 0 5px; padding: 3px 0 0 0;'> <a class='twitter-share-button' data-count='vertical' href='http://twitter.com/share'>Tweet</a> <script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></span> <span id='md-plusone' style='float:left; padding-top: 4px; margin: 0 5px;'> <script src='https://apis.google.com/js/plusone.js' type='text/javascript'/> <g:plusone size='tall'/></span> <span id='md-fblike' style='float: left; margin: 0 5px; padding: 4px 0 0; width: 50px; overflow: hidden;'> <div id='fb-root'/> <script src='http://connect.facebook.net/en_US/all.js#appId=155934781145405&amp;xfbml=1'/> <fb:like font='' href='' layout='box_count' send='false' show_faces='false' width='50'> </fb:like> </span> <div style='display:block; margin: 0 5px; padding: 5px 0px 0px; color: #FFFFFF'> Don't you think that this great article should be shared.<br/></div></div></div> </b:if>

What Do I Say About The Widget

I am using this widget on my blog also and it increased the social shares of my blog by 31%,I was also surprised to see this but now I like this widget so much that I won't remove it even when I would change my blog's template.I would recommend you to try this widget out,it's seo friendly and it don't affect blog's loading time.