Scrolling Like Social Sharing Buttons Widget For Blogger

Today I'm going to share Scrolling Like Social Sharing Buttons Widget For Blogger. It's going to increase your visitors growth. It will also increase your social group counters just like facebook, google plus & twiters. For anyone who is still struggle to receive a massive traffics from social media marketing websites then were strongly recommended to use this widget. Many individuals called it Don't forget to join our community widget regarding blogger were presenting people as free of costs.
Truly this widget is completely created within Css & javascript having awesome diverse stylishly designing. Due to coding within javascript many Bloggers dislike because many of us also know from so very long that any gadget coded within javascript may compel the blog on filling time. But possibly be trust about me this gadget isn't that much heavy. it has a simple layout as well as less javascript coded incorporated. We possess changed this designing directly into different stylishly designing. It has become decorated having several color. Bloggers usually are advice to choose a greatest one in line with his/her blog site designing & designs.

How does it Work:

As the name "scrolling" by means you can use that by scrolling your mouse here at the top and bottom. This gadget can look if person bring your mouse cursor in the bottom in the blog. When your cursor of the mouse cross the center of blog or maybe website it is going to suddenly seem.

How to Install Scrolling Like Social Sharing Buttons Widget:

Follow easy steps to install this gadget. Choose the color from given colors below according to your template design and color.

Step 1. 

Here is a complete listing of all common colors widget with diverse style. You will only have to pick and also the best one in line with your website designing layout.

This may remember just because after deciding on the widget it colour code will probably replace while using the default colour code into the widget coding. Just simply copy large code from the below leading 14 widgets. Get your individual choice.

#DC143C

#32CD32

#9400D3

#191970

 #663333

#808000

 #B0E0E6

#D2691E

#F3F3F3

#F4A460

#FFFF00

#000000

#708090

#A0522D

Step 2. 

Login to Blogger account.

Then go to template and Find this ]]></b:skin> Piece of code by pressing Ctrl+F.

Copy the Following code and paste just before/above ]]></b:skin>.

See in following Image.

#pbtsocialslide{background:#f3f3f3;
border-radius:9px;
-moz-border-radius:9px;
-webkit-border-radius:9px;
-moz-box-shadow:inset 0 0 3px #333;
-webkit-box-shadow:inset 0 0 3px #333;
box-shadow:inner 0 0 3px #333;
padding:12px 14px 12px 14px;
width:300px;position:fixed;
bottom:13px;
right:2px;
display:none;
z-index:3;
height:65px;}

Replace the Red Color(#f3f3f3) with the gadget code that you have chosen from above given gadget code.

If you want to curve sides of gadget then replace the value from 9px 9px 9px with 3px 49px 49px. It will Look like below gadget.

Step 3:
 Again go to blogger Dashboard

Go to layout >> Add Gadget >> HTML/JavaScript

copy the below code and paste into HTML/JavaScript Box.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript">$(window).scroll(function(){if($(document).scrollTop()>=$(document).height()/4)$("#pbtsocialslide").show("slow");else $("#pbtsocialslide").hide("slow");});function closePBTsocialslide(){$('#pbtsocialslide').remove();$.ajax({type:"POST",url:"/facebookpage.php"});}</script>
<div style="display: none;" id="pbtsocialslide">
<a style="position:absolute;top:14px;right:10px;color:#555;font-size:10px;font-weight:bold;" href="javascript:void(0);" onclick="return closePBTsocialslide();">(X)</a>
<span style="font-family: Tekton Pro; font-size: 20px; margin: 10px 0; text-shadow: 1px 1px 0 #FFFFFF;">Don't forget to join our community!</span><br />
<div style="float:left; margin:15px;"><g:plusone annotation="none"></g:plusone></div>

<div style="float:left; margin:15px;"><iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FBlogger2wordpress&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowtransparency="true"></iframe></div>

<div style="float:left; margin:15px;"><a href="https://twitter.com/Blogger2wordpress" class="twitter-follow-button" data-show-count="false" data-size="large" data-show-screen-name="false">Follow @hannygames</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
</div>

<div class='clear'></div>


Remember: 
Replace the Red color text with your Facebook Username.

Replace the Light Blue Color text with your twiter username.

Now save it...

Please Give Us Your 1 Minute In Sharing This Post!

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Powered By: ITmaza