Shayari & Jokes: Facebook Like Box Pop Up Window For Blogger

Facebook is a very good tool to gain traffic for your blog. Every blog should have its facebook fan page. We should also keep trying to get more and more facebook likes on our fan page. The likes will increase the visibility and traffic of your blog also increase. So there are a lots of tips to increase your fan page's likes. Now here I came up with a tool for you all. It is a widget for your blog. When anyone will open your blog a popup window will open in the center of their monitor asking to like your facebook fan page. Now lets see how can we implement it to our blog.

Steps: To add facebool like box pop up

GO to Dashboard > layout

Click on add a Gadget
Then select Html/java Script

Paste the following code into this

<style>

/* ColorBox Core Style: */

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}

#cboxOverlay{position:fixed; width:100%; height:100%;}

#cboxMiddleLeft, #cboxBottomLeft{clear:left;}

#cboxContent{position:relative;}

#cboxLoadedContent{overflow:auto;}

#cboxTitle{margin:0;}

#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

.cboxPhoto{float:left; margin:auto; border:0; display:block;}

.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* User Style:

You can modify the following code as per your visual requirement. */

#cboxOverlay{background:#000;opacity:0.5 !important;}

#colorbox{

box-shadow:0 0 15px rgba(0,0,0,0.4);

-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);

-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);

}

#cboxTopLeft{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1VcOC9Mo7pTVZjNkWyXnZpt_tWfVlmf2tZ1Pu0P62kXv4zNAylBRa6t6m6NBYGbpbzuXudZV094Z-bIXCk9aF9N7WL5yHSPvwtAZH-ZdFtPRvgCWTTf3Ueyl4-XBicEanDj9uEHHgcTL/s1600/controls.png) no-repeat 0 0;}

#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEUlGGFHcvhiMmlpcgR4xNK2Vtn9JGLlEK7Y4ef-hoEuIpA-t6LRzQJ1IpJ3raEWfmi1kUtQbyBAkMIbtALHfd_kUUoEQnHj3Pge9aDif_wEjsc6w5WBuKeXvWHB6u9tSB0JKP8-pG0g-f/s1600/border.png) repeat-x top left;}

#cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1VcOC9Mo7pTVZjNkWyXnZpt_tWfVlmf2tZ1Pu0P62kXv4zNAylBRa6t6m6NBYGbpbzuXudZV094Z-bIXCk9aF9N7WL5yHSPvwtAZH-ZdFtPRvgCWTTf3Ueyl4-XBicEanDj9uEHHgcTL/s1600/controls.png) no-repeat -36px 0;}

#cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1VcOC9Mo7pTVZjNkWyXnZpt_tWfVlmf2tZ1Pu0P62kXv4zNAylBRa6t6m6NBYGbpbzuXudZV094Z-bIXCk9aF9N7WL5yHSPvwtAZH-ZdFtPRvgCWTTf3Ueyl4-XBicEanDj9uEHHgcTL/s1600/controls.png) no-repeat 0 -

32px;}

#cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEUlGGFHcvhiMmlpcgR4xNK2Vtn9JGLlEK7Y4ef-hoEuIpA-t6LRzQJ1IpJ3raEWfmi1kUtQbyBAkMIbtALHfd_kUUoEQnHj3Pge9aDif_wEjsc6w5WBuKeXvWHB6u9tSB0JKP8-pG0g-f/s1600/border.png) repeat-x bottom left;}

#cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1VcOC9Mo7pTVZjNkWyXnZpt_tWfVlmf2tZ1Pu0P62kXv4zNAylBRa6t6m6NBYGbpbzuXudZV094Z-bIXCk9aF9N7WL5yHSPvwtAZH-ZdFtPRvgCWTTf3Ueyl4-XBicEanDj9uEHHgcTL/s1600/controls.png) no-repeat -36px

-32px;}

#cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1VcOC9Mo7pTVZjNkWyXnZpt_tWfVlmf2tZ1Pu0P62kXv4zNAylBRa6t6m6NBYGbpbzuXudZV094Z-bIXCk9aF9N7WL5yHSPvwtAZH-ZdFtPRvgCWTTf3Ueyl4-XBicEanDj9uEHHgcTL/s1600/controls.png) repeat-y -175px 0;}

#cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1VcOC9Mo7pTVZjNkWyXnZpt_tWfVlmf2tZ1Pu0P62kXv4zNAylBRa6t6m6NBYGbpbzuXudZV094Z-bIXCk9aF9N7WL5yHSPvwtAZH-ZdFtPRvgCWTTf3Ueyl4-XBicEanDj9uEHHgcTL/s1600/controls.png) repeat-y -211px 0;}

#cboxContent{background:#fff; overflow:visible;}

#cboxLoadedContent{margin-bottom:5px;}

#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWpZ19FFnKRmXU9iz5i-rUulMrc5Li0XRT-zOsRp4ZOAP6Di7ixsG7HfEgJ5jQZgzmTJ8UoTgFbL2aWB3ZF0qQg-o2x8KwMLMMA1n8rctnSwaQ6XcGZzk7hLNPmyNSkm7WRjYMDAJbzU_W/s1600/loading-background.png) no-repeat center center;}

#cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO2rApI-5MDsjldHB-G9sRy8NGU6I3lWraHhCf_R1TVU4iNcUCOZUrYwuN9bii2ak1wmwg3-xi2hbY3PWwZztp6X0K2lE9MlUWSNoV0KnKdRqNagXJ6QX-aTgv6ak-NKCGh3pqPubjf2C8/s1600/loading.gif) no-repeat center center;}

#cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}

#cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(http://1.bp.blogspot.com/-

FiJ_Xz7txEg/Txrt0sy1TiI/AAAAAAAAFWk/Llzvkeyy_J8/s1600/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}

#cboxPrevious{left:0px; background-position: -51px -25px;}

#cboxPrevious.hover{background-position:-51px 0px;}

#cboxNext{left:27px; background-position:-75px -25px;}

#cboxNext.hover{background-position:-75px 0px;}

#cboxClose{right:0; background-position:-100px -25px;}

#cboxClose.hover{background-position:-100px 0px;}

.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}

.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}

.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}

.cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}

/*-----------------------------------------------------------------*/

/* Pop Up window of Facebook Likebox For Blogger by All Tech Story

/*-----------------------------------------------------------------*/

#subscribe {

font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;

}

#subscribe a,

#subscribe a:hover,

#subscribe a:visited {

text-decoration:none;

}

.box-title {

color: #3B5998;

font-size: 20px !important;

font-weight: bold;

margin: 10px 0;

border:1px solid #ddd;

-moz-border-radius:6px;

-webkit-border-radius:6px;

border-radius:6px;

box-shadow: 5px 5px 5px #CCCCCC;

padding:10px;

line-height:25px; font-family:arial !important;

}

.box-tagline {

color: #999;

margin: 0;

text-align: center;

}

#subs-container {

padding: 35px 0 30px 0;

position: relative;

}

a:link, a:visited {

border:none;

}

.demo {

display:none;

}

</style>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script>

<script src="http://yourjavascript.com/11215013191/jquery.colorbox-min.js"></script>

<script type="text/javascript">

jQuery(document).ready(function(){

if (document.cookie.indexOf('visited=true') == -1) {

var fifteenDays = 1000*60*60*24*30;

var expires = new Date((new Date()).valueOf() + fifteenDays);

document.cookie = "visited=true;expires=" + expires.toUTCString();

$.colorbox({width:"400px", inline:true, href:"#subscribe"});

}

});

</script>

<div style='display:none'>

<div id='subscribe' style='padding:10px; background:#fff;'>

<center>

frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>

</center>

</div>