gadget Module Social Facebook (Facebook Fans) or twitter fans floating on your blogger blogs :
the gadget just displays a small logo on Facebook or twitter right side of your blog, logo remains fixed in one place, the player move up or down the page.
When the mouse moves over the logo, it expands to display the Facebook social module or twitter social module, a sample of your blog fans on Facebook or twitter and the ability to love that page where to go by clicking on his name.
To view this Social Facebook Gadget Module floating on your blog, here are the steps to follow:
1. Log into Blogger and click "Model" for the blog where you will install the module floating Social Facebook and then "Edit".
2. Find the </ head> and paste the following code just before:
<script src = 'https: //ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type = 'text / javascript' />
Save your model.
4. Paste the following code into your new Gadget HTML / Javascript:
<script type="text/javascript"> //<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate ({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");},
500);}); //--> </script>
<style type="text/css">
.w2bslikebox{background: url("http://1.bp.blogspot.com/-UuBsjDC5vSc/TuiSd0g9bHI/AAAAAAAAAyk/MqKt8IpiIVM/s1600/facebook1.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 10px;font: 9px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #FF9D00;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/yourpagefacebookhere&
width=245&colorscheme=light&show_faces=true& connections=8&stream=false&header=false&height=330" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://www.bloggersens.com/2014/08/float-social-gadget.html">get this widget</a></span><span><a href="http://bloggersens.com">Blogger</a></span></div></div>
Replace the red with the url of the page of your blog fans on Facebook and click "Save" and will see what happens on your blog.
After article showing how to add a Gadget Fans on Facebook floating on his blog Blogger, we'll see how to add a Gadget Twitter Followers floating on blogspot.
As the gadget previously seen, Twitter button will display on the side that you like (right or left)
Here's the steps to get this Twitter Followers Gadget on blogger blogspot:
1.first Log into Blogger and click "Model" for the blog where you will install the module floating Social Facebook and then "Edit".
2. Find the </ head> and paste the following code just before:
<script src = 'https: //ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type = 'text / javascript' />
Save your model.
Note that if you have already installed the Gadget Fans on Facebook float, you can skip this step.
3 Go to "Elements of the page", click on "Add a Gadget" on your sidebar and select "HTML / Javascript".
4 Paste the following code into your new Gadget HTML / Javascript:
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".twitterboxot").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function()
{$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//--> </script>
<style type="text/css">
.twitterboxot{background: url("http://2.bp.blogspot.com/-vurRhxn0aJA/TvCvyxkOm_I/AAAAAAAAA0k/3stDSZYMdVg/s1600/twitterbox.png")
no-repeat scroll left center transparent !important;
display: block;
float: right;
height: 240px;
padding: 0 5px 0 46px;
width: 245px;
z-index: 99999;
position:fixed;
right:-250px; top:20%;}</style>
<div class="twitterboxot"><div>
<script type="text/javascript"
src="http://script-ot.googlecode.com/svn/twitterbox.js"></script><div
id="twitterfanbox"></div>
<script type="text/javascript">fanbox_init("twitter-id");</script></div><div style="font-size:10px;">
<a href="http://www.bloggersens.com/2014/08/float-social-gadget.html" target="_blank">Get This Widget</a>
</div></div>
In the above gadget, change the "right" in red with "left" if you want the Gadget Twitter Followers Rather appears on the left or change the red by 20% to 60% if you want to keep it with the button Facebook right.
Do not forget to change "twitter-id" with your Twitter username.
5 Click "Save" and go see the results on your blog.
Now you too can have the Gadget Twitter Followers floating on your blog hosted by Blogger.
it's great no ?
enjoy
the gadget just displays a small logo on Facebook or twitter right side of your blog, logo remains fixed in one place, the player move up or down the page.
When the mouse moves over the logo, it expands to display the Facebook social module or twitter social module, a sample of your blog fans on Facebook or twitter and the ability to love that page where to go by clicking on his name.
To view this Social Facebook Gadget Module floating on your blog, here are the steps to follow:
1. Log into Blogger and click "Model" for the blog where you will install the module floating Social Facebook and then "Edit".
2. Find the </ head> and paste the following code just before:
<script src = 'https: //ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type = 'text / javascript' />
Save your model.
4. Paste the following code into your new Gadget HTML / Javascript:
<script type="text/javascript"> //<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate ({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");},
500);}); //--> </script>
<style type="text/css">
.w2bslikebox{background: url("http://1.bp.blogspot.com/-UuBsjDC5vSc/TuiSd0g9bHI/AAAAAAAAAyk/MqKt8IpiIVM/s1600/facebook1.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 10px;font: 9px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #FF9D00;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/yourpagefacebookhere&
width=245&colorscheme=light&show_faces=true& connections=8&stream=false&header=false&height=330" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://www.bloggersens.com/2014/08/float-social-gadget.html">get this widget</a></span><span><a href="http://bloggersens.com">Blogger</a></span></div></div>
Replace the red with the url of the page of your blog fans on Facebook and click "Save" and will see what happens on your blog.
After article showing how to add a Gadget Fans on Facebook floating on his blog Blogger, we'll see how to add a Gadget Twitter Followers floating on blogspot.
As the gadget previously seen, Twitter button will display on the side that you like (right or left)
Here's the steps to get this Twitter Followers Gadget on blogger blogspot:
1.first Log into Blogger and click "Model" for the blog where you will install the module floating Social Facebook and then "Edit".
2. Find the </ head> and paste the following code just before:
<script src = 'https: //ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type = 'text / javascript' />
Save your model.
Note that if you have already installed the Gadget Fans on Facebook float, you can skip this step.
3 Go to "Elements of the page", click on "Add a Gadget" on your sidebar and select "HTML / Javascript".
4 Paste the following code into your new Gadget HTML / Javascript:
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".twitterboxot").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function()
{$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//--> </script>
<style type="text/css">
.twitterboxot{background: url("http://2.bp.blogspot.com/-vurRhxn0aJA/TvCvyxkOm_I/AAAAAAAAA0k/3stDSZYMdVg/s1600/twitterbox.png")
no-repeat scroll left center transparent !important;
display: block;
float: right;
height: 240px;
padding: 0 5px 0 46px;
width: 245px;
z-index: 99999;
position:fixed;
right:-250px; top:20%;}</style>
<div class="twitterboxot"><div>
<script type="text/javascript"
src="http://script-ot.googlecode.com/svn/twitterbox.js"></script><div
id="twitterfanbox"></div>
<script type="text/javascript">fanbox_init("twitter-id");</script></div><div style="font-size:10px;">
<a href="http://www.bloggersens.com/2014/08/float-social-gadget.html" target="_blank">Get This Widget</a>
</div></div>
In the above gadget, change the "right" in red with "left" if you want the Gadget Twitter Followers Rather appears on the left or change the red by 20% to 60% if you want to keep it with the button Facebook right.
Do not forget to change "twitter-id" with your Twitter username.
5 Click "Save" and go see the results on your blog.
Now you too can have the Gadget Twitter Followers floating on your blog hosted by Blogger.
it's great no ?
enjoy