All Time Popup With Facebook LikeBox For Blogger Blogs

If you've been a fervent reader of my blog post you'll notice we (Nairotech team) recently lauched our ENTERTAINMENT BLOG, which is GIST EMPEROR.. and within the first two months we started having #1,598 unique visitors and #2,354 avg visit perday with an alexa rank of #894,098...

To be candid with you, i got most of my traffic from facebook and twitter that's why social media sites are very important....and needed in your blogging carrier. Well, this brings us to our topic and discussion for today.. Everybody needs more fans (active) added to their facebook page or any other social media platform, that's why i had to bring up this post so you to can acquire more fans with this widget to help boost your social presence and income online too.

You'll notice we already have so many trending facebook pop-up  boxes avaivable but i prefer sharinq this with you because it's simple and very ok to use... Some of your blog readers will be deterred seeing a troubling pop-up box whenever they visit, so i urge you to use this..

This popup shows the like box with pictures. It also  enables readers to give good facebook feedbaccks and support. It is the curious way of targeting more people to drive into your blog. 

How To Add Simple Facebook Pop-up To Your Blogger Blog

1. Login to your Blogger account

2. Go to dashboard and move on Layout section

3. Click on Add a gadget link and select HTML/JavaScript option

<style type="text/css">
#nairotech-box {
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;
}
#nairotech-box 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 src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).bind("load", function() {
$('#nairotech-box').animate({top:"50px"}, 1000);
$('a.bsclose').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id="nairotech-box">
<!-- Widget by www.nairotech.com Start -->
<center>
<b><a class="Blogtariff" href="http://www.blogger.com/null">Don't Forget To Like Us</a></b>
</center>
<center>
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fnairotech&amp;width=292&amp; height=258&amp;show_faces=true&amp; colorscheme=light&amp;stream=false&amp; show_border=true&amp; header=false" style="border: none; height: 258px; overflow: hidden; width: 292px;">
</iframe>
</center>
<!-- Widget by www.nairotech.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://goo.gl/LdBXPI">nairotech</a></center>
</div>
</div>

Replace nairotech with facebook fanpage name of your blog.

That's all. You are done!
Finally, Click on the Save the buton.

If you encounter any problem, feel free and comment below to get a solution. Share your Experience with us by commenting below.