New Smooth Floating Social Bookmarking Widget

M Ehsan Qureshi Blogger Hacks

I have already shared such a very beautiful widgets with you on the same topic but I think those were very old but what I have got today this one may be very much convincing, I am sure. Before I have shared with you a new Mashable Social Media Widget and people like it very much.

Today I have a new Floating Social Media Bookmarker and Sharing Widget with Smooth Scrolling and a new look. Sharing contents on social media sites is very important as we all know and I have already discussed deeply regarding benefits of Social Media because its bring flood of traffic to our website.

smooth floating social sharing sidebar plugin for blogger

How You Also Like this

How to Install New Smooth Floating Social Media Bookmarking to Blogger.

Now I will tell you how you can we install this widget to blogger.

CHECK HERE LIVE DEMO

You may follow given steps to install this floating social media sharing plugin to Blogspot blog.

Simply go to Blogger.com > Blogger Dashboard
Then Backup you blogger template
Go to > Layout > Add a Gadget >

HTML/JavaScrip Widget

(wherever you want but must be in sidebar) not in the footer.

Then copy this following code and past in HTML/JavaScript Gadget.

	<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
	<script type='text/javascript'>
	// <![CDATA[
	$(function() {
	var offset = $("#FloatingSocialButtons").offset();
	var topPadding = 15;
	$(window).scroll(function() {
	if ($(window).scrollTop() > offset.top) {
	$("#FloatingSocialButtons").stop().animate({
	marginTop: $(window).scrollTop() - offset.top + topPadding
	});
	} else {
	$("#FloatingSocialButtons").stop().animate({
	marginTop: 0
	});
	};
	});
	});
	// ]]>
	</script>
	<style>
	#FloatingSocialButtons {
	position: absolute;
	left: -100px;
	background-color: #F2F2F2;
	border: 1px solid #D8D8D8;
	border-right: 0;
	z-index:9;
	border-radius:10px;
	-moz-border-radius: 10px;
	}
	#FloatingSocialButtons div {
	margin: 5px 0 0 0;
	}
	</style>

	<div id='FloatingSocialButtons'>
	<center>
	<div style='margin:0px 0 0px 10px;'><div id='fb-root'></div><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script><fb:like font='' href='' layout='box_count' send='false' show_faces='false'></fb:like></div>
	<div><a class='twitter-share-button' data-count='vertical' data-lang='en' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script></div>
	<div><script src='http://apis.google.com/js/plusone.js' type='text/javascript'></script><g:plusone size='tall'></g:plusone></div>
	<div style='margin-top: 15px;'><a data-pin-config='vertical' data-pin-do='buttonPin' href='http://pinterest.com/pin/create/button/?url='data:post.url' '><img src='//assets.pinterest.com/images/pidgets/pin_it_button.png'/></a>
	<span style='margin-left:-44px;'><a data-pin-config='vertical' data-pin-do='buttonBookmark' href='//pinterest.com/pin/create/button/' style='outline:none;border:none;'></a></span>
	<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'></script></div>
	<br />
	<p style=' line-height:0px; font-size:10px; font-weight:bold; text-align:center;'><a href='www.tipstricksisland.com/2013/05/new-smooth-floating-social-bookmarking-blogger-2013.html' style='color:#CAC8C8;'>Get This</a></p>
	</center></div>

view raw smooth-floating-social-sharing-widget-blogger.html hosted with ❤ by GitHub

You have all done Now Check your blog homepage.. I hope you will like my this widget.

Check This:-

Keep in touch and stay connected with by following us on Twitter, Facebook Pinterest or by Subscribing our daily news updates
Any further assistance you can ask by commenting on this post

New Smooth Floating Social Bookmarking Widget

How to Install New Smooth Floating Social Media Bookmarking to Blogger.

Comments

Featured

Advertisement

Follow us

Tags

Advertisement