Add Tech-Scrolling Facbook Popup Like Box Widget for Blogger

In our blog we’ve already shared few Popup widgets for Facebook, like Sliding-Floating, popup with timer, simple Facebook popup widget for blogger. These facebook widgets mostly used to get more likes for blogs and websites. Here blogtariff brings you another facebook popup widget with closing button to gain more facebook likes. In my view this widget won’t annoy visitors more, it'll reminds those readers those who are new to your blog. If any visitor launch on your blog then this widget popup to like facebook, after that reader liking facebook then automatically won’t appear again for them.
This widget specially designed with scrolling effect, popup style, with simple format. Webmasters don’t need to work hard for adding this widget to their blogs, simply copy the code given below add to blog or website. Users can adjust the color of widget according to their desire by easy customization tips. Let’s begin the tutorial for adding facebook popup widget.

How to Add ‘Tech-Scrolling Facebook Popup Like box widget for blogger?
Sign into your blogger account
Select ‘Layout’ link tab
Click on ‘Add a Gadget’ and select ‘HTML/Javascript’ link tab widget
Now copy the below code and paste in it

<style type='text/css'>
#blogtariffFBpop {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#FEFEFE;font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#blogtariffFBpop a.bsclose {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#000000;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:25px;
cursor:pointer;
}
</style>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top
$('#blogtariffFBpop').animate({top:"50px"}, 1000);
// Widget by www.blogtariff.com
$('a.bsclose').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='blogtariffFBpop'>
<!-- Widget by www.blogtariff.com Start -->
<center><b><a class="Blogtariff">Don't Forget To Join With Our Community</a></b></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2FBlogtariffcom&amp;width=292&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=true&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowTransparency="true"></iframe></center>
<!-- Widget by www.blogtariff.com End -->
<a class='bsclose' href='#'>&times;</a>
<center style="float:right; margin-right:10px;"><span style="font-size:xx-small; color:#000; text-decoration:none;">+Get this at</span> <a target='_blank' style="font-size:xx-small; color:#3B78CD; text-decoration:none;" href="http://www.blogtariff.com/2013/06/add-tech-scrolling-facbook-popup-like.html">BlogTariff</a></center>
</div>

Customization:-
Replace FEFEFE color code with your choice color code by using our Color Chart
Replace Blogtariffcom word with your facebook page ID