How To Add Facebook Pop Up Like Box To Blog

For Demo See Here :- DEMO

Hey Friends,
Today It's Post About Widgets Of Blog, Here I Am Going To Share Facebook Pop Up Like Box For Blogger Blog. Facebook Is A Best Way To Promote Your Blog In Social Networks And It's Also Simple To Invite And Attract Peoples To Your Blog Via Facebook. This Widget Will Help You To Increase Your Facebook Page Liker And From This You Can Get Good Traffic Day By Day. This Type Of Pop Up Box Will Open When Any Visitor Come To Your Blog Then It's Appear First Like Above Picture. There Are Many Ways For Facebook Sharing Like Facebook Groups, Facebook Pages, Facebook Applications And Many More, This All Can Help Us For Increasing Value And Attract People To Your Blog. In This Facebook Pop Up Like Box You Can Easily And You Can Change Or Customise Manually.

Here Below Steps For Add Facebook Pop Up Like Box In Blogger Blog,

Step 1 :- Go To Blogger.com.

Step 2 :- Open Your Blog Dashboard And Go To "Layout".

Step 3 :- Click "Add A Gadget" And Scroll To "HTML-JAVASCRIPT" And Click "+" Icon To Add It.

Step 4 :- Now Copy The Below Code And Paste It In This HTML-JAVASCRIPT Box With Below Changes.

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

<script src="https://facebookpopup2.googlecode.com/files/jquery.cbt-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=true') == -1)
{
var fifteenDays = 1000*60*60*24*29;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"399px", inline:true, href:"#exestylepopups"});
}
});
</script>
<style type="text/css">
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden}#cboxOverlay{position:fixed;width:99%;height:99%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto}#cboxTitle{margin:1}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:1;display:block}.cboxIframe{width:99%;height:99%;display:block;border:1}#cboxOverlay{background:#001;opacity:0.5 !important}#colorbox{box-shadow:0 0 14px rgba(0,0,0,0.4);-moz-box-shadow:0 0 14px rgba(0,0,0,0.4);-webkit-box-shadow:0 0 14px rgba(0,0,0,0.4)}#cboxTopLeft{width:15px;height:15px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) no-repeat 0 0}#cboxTopCenter{height:15px;background:url(http://goo.gl/O9QP9) repeat-x top left}#cboxTopRight{width:15px;height:15px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) no-repeat -36px 0}#cboxBottomLeft{width:15px;height:44px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) no-repeat 0 -32px}#cboxBottomCenter{height:44px;background:url(http://goo.gl/O9QP9) repeat-x bottom left}#cboxBottomRight{width:15px;height:44px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) no-repeat -36px -32px}#cboxMiddleLeft{width:15px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) repeat-y -175px 0}#cboxMiddleRight{width:15px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) repeat-y -211px 0}#cboxContent{background:#ffe;overflow:visible}#cboxLoadedContent{margin-bottom:6px}#cboxLoadingOverlay{background:url(http://goo.gl/seJqH) no-repeat center center}#cboxLoadingGraphic{http://goo.gl/u3upJ) no-repeat center center}#cboxTitle{position:absolute;bottom:-24px;left:0;text-align:center;width:100%;font-weight:bold;color:#736f6f}#cboxCurrent{position:absolute;bottom:-24px;left:59px;font-weight:bold;color:#736f6f}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{position:absolute;bottom:-28px;background:url(https://lh5.googleusercontent.com/-Oonf3hVB8Vk/UUVyfEEnnEI/AAAAAAAABBU/ymAdg3uHHkM/h120/controls.png) no-repeat 0px 0px;width:24px;height:24px;text-indent:-9999px}#cboxPrevious{left:0px;background-position:-50px -24px}#cboxPrevious.hover{background-position:-50px 0px}#cboxNext{left:27px;background-position:-74px -24px}#cboxNext.hover{background-position:-74px 0px}#cboxClose{right:0;background-position:-99px -24px}#cboxClose.hover{background-position:-99px 0px}.cboxSlideshow_on #cboxSlideshow{background-position:-124px 0px;right:26px}.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px}.cboxSlideshow_off #cboxSlideshow{background-position:-149px -26px;right:26px}.cboxSlideshow_off #cboxSlideshow.hover{background-position:-124px 0px}#mdfb{font:12px/1.2 Arial,Helvetica,san-serif;color:#5c5757}#mdfb a,#mdfb a:hover,#mdfb a:visited{text-decoration:none}.mdbox-title{background:#000;color:#ffff;font-size:21px !important;font-weight:bold;margin:9px 0;border:19px solid #ddd;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;box-shadow:5px 5px 5px #CCC;padding:10px;line-height:24px;font-family:arial !important}
</style>
<div style='display:none'>
<div id='exestylepopups' style='padding:10px; background:#ffff;'>
<center><h3 class="mdbox-title">Receive updates via Facebook. Click the Like Button Below...</h3></center><center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fcoolblogtrickss&amp;width=299&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=257" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:299px; height:257px;" allowtransparency="true"></iframe>
</center><p style=" float:right; margin-right:34px; font-size:10px;" >Powered By <a style=" font-size:10px; color:#397ad4; text-decoration:none;" href="http://www.coolblogtricks.com">Cool Blog Tricks</a></p>
</div></div>

Customization :-

• Replace Coolblogtrickss With Your Facebook Username.
• If You Want To Appear This Widget On Every Reload Of Your Visitor In All Pages Then, Just Change True To False.
• This Widget Will Again POPUP On Your Visitor's Desktop After 30 Day If He Is Clearing His Browser Cookies, If You Want To Minimize Or Maximize This Time, Just Change *30 From The Above Code To Your Desire Day In 1 To 30.
• It Will Not POP Up Again And Again On Every Reload. To View The Widget Just Delete Your Browser Cookies Then Reload.
• You Can Also Change The Text In Blue Text.

Step 5 :- Save It. . .  All Is Done. .

This Is How Facebook Pop Up Appear In Blogger Blog They Have Many Versions Means New Designs And Features Which I Will Post Later. . .
If You Like This Then Share With Your Friends. .