Social Media Sharing Button Widget After Every Blogger Post

M Ehsan Qureshi Blogger Widget

This post may be very useful for all of my visitors because all we more discuss is Social Media Sharing widget for every blogger post because this is the need for almost every blog.

Social Media helps you to increase your blog traffic. Today I am sharing this amazing Social Media Widget, which comes in beautiful animated icons, here below is the script from which you can add this beautiful widget to your blog. You can see a live demo at the end of this post.

CHECK LIVE DEMO HERE

social media sharing widget below the post blogspot

Read:-

Add Social Media Sharing Widget in Every Blogger Blogspot Post in the bottom

Follow these step to install.

Simply Login into your Blogger Account.

Select Your Blogspot Blog.

Go to theme then Edit HTML

Click on the Formate Template Button

Now find this code

<data:post.body/>

You may find this code more than one time, try in all)

Paste the following code just after <data:post.body/>

	<style>
	/--------Social Sharing Widget Below Blog Post ------/
	.sharebelow a {
	display:block;
	height:48px;
	width:48px;
	padding:0 4px;
	float:left;
	background:transparent url(http://3.bp.blogspot.com/-vslV5wtB7Hc/T_iYKWWojFI/AAAAAAAAAKc/IBi91mIC0b8/s1600/sharebelow.png) no-repeat;
	}
	.sharebelow a.googleplus {
	background-position: 0px -348px;
	}
	.sharebelow a.googleplus:hover {
	background-position: 0px -406px;
	}
	.sharebelow a.pinterest {
	background-position: 0px -464px;
	}
	.sharebelow a.pinterest:hover {
	background-position: 0px -522px;
	}
	.sharebelow a.delicious {
	background-position: 0px 0px;
	}
	.sharebelow a.delicious:hover {
	background-position: 0px -58px;
	}
	.sharebelow a.digg {
	background-position: 0px -116px;
	}
	.sharebelow a.digg:hover {
	background-position: 0px -174px;
	}
	.sharebelow a.stumbleupon {
	background-position: 0px -812px;
	}
	.sharebelow a.stumbleupon:hover {
	background-position: 0px -870px;
	}
	.sharebelow a.technorati {
	background-position: 0px -928px;
	}
	.sharebelow a.technorati:hover {
	background-position: 0px -406px;
	}
	.sharebelow a.twitter {
	background-position: 0px -928px;
	}
	.sharebelow a.twitter:hover {
	background-position: 0px -986px;
	}
	.sharebelow a.facebook {
	background-position: 0px -232px;
	}
	.sharebelow a.facebook:hover {
	background-position: 0px -290px;
	}
	.sharebelow a.reddit {
	background-position: 0px -580px;
	}
	.sharebelow a.reddit:hover {
	background-position: 0px -638px;
	}
	.sharebelow a.rss {
	background-position: 0px -696px;
	}
	.sharebelow a.rss:hover {
	background-position: 0px -754px;
	}
	.shareandbookmark{
	margin:10px 0px;
	color:#333333;
	font-weight:bold;
	font-size:18px;
	font-family:sans-serif;
	}
	</style>
	<div class='sharebelow'>
	<b:if cond='data:blog.pageType == "item"'>
	<div class="shareandbookmark">
	Kindly Bookmark and Share it:</div>
	<!--Facebook-->
	<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + data:post.title' rel='external nofollow' target='_blank' title='Share this on Facebook :>'/>
	<!--Google Plus-->
	<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:post.url' rel='external nofollow' target='_blank' title='+1 it :>'/>
	<!-- Twitter -->
	<a class='twitter' expr:href='"http://twitthis.com/twit?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank' title='Tweet this :>'/>
	<!-- Pinterest -->
	<a class='pinterest' href="http://pinterest.com/" rel='external nofollow' target='_blank' title='Pin it :>'/>
	<!-- Delicious -->
	<a class='delicious' expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank' title='Add this to Delicious :>'/>
	<!--Stumble-->
	<a class='stumbleupon' expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank' title='Stumble this :>'/>
	<!--DIGG-->
	<a class='digg' expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url' rel='external nofollow' target='_blank' title='Digg this :>'/>
	<!-- Reddit -->
	<a class='reddit' expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank' title='Add this to Reddit :>'/>
	<!--RSS -->
	<a class='rss' expr:href='data:blog.homepageUrl + "feeds/posts/default"' target='_blank' title='Bookmark :>'/>
	</b:if></div>
	<div style="clear:both"/>