How to add Facebook Popup Like Box to Blogger

This is Sample

How to Add Facebook Popup Like Box

• Login to your blogger dashboard
• Click on "Layout"
• Click on "Add a Gagdet"
• Select "HTML/Javascript"
• Copy the Code below and paste in the field.

Note: Do not put any name on the widget.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>

<script src='http://aireshalili.github.io/internetsmash/facebook-popup-box.js' type='text/javascript'></script>

<style>

#popup-facebook{display:none;background:rgba(0,0,0,0.5);width:100%;height:100%;position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999999}

#popup-facebook .popup-box{padding:3px 5px 5px;position:relative;margin:0 auto;max-width:280px;z-index:0;top:25%;background:#CDCDCD}

#popup-facebook .popup-box .exit-button{position:absolute;cursor:pointer;right:0;top:-4px;margin-top:5px}

#popup-facebook .popup-box .exit-button:before{content:"CLOSE";margin-right: 5px;background:#CDCDCD;color:#000;font-weight:700;font-size:10px;font-family:sans-serif}

#follow-us{font-size:13px;color:#690000;}

</style>

<div id="fb-root"></div>

<script>(function(d, s, id) {

  var js, fjs = d.getElementsByTagName(s)[0];

  if (d.getElementById(id)) return;

  js = d.createElement(s); js.id = id;

  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=124246297655999&version=v2.3";

  fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

<script type='text/javascript'>

jQuery(document).ready(function($){if($.cookie('popup_facebook_box')!='yes'){$('#popup-facebook').delay(8000).fadeIn('medium');$('.exit-button').click(function(){$('#popup-facebook').stop().fadeOut('slow')})}$.cookie('popup_facebook_box','yes',{path:'/',expires:10})});

</script>

<div id='popup-facebook'>

<div class='popup-box'>

<div id='follow-us'>Follow US On Facebook</div>

<div class='exit-button'></div>

<div style='overflow: hidden !important;'><div class="fb-page" data-href="https://www.facebook.com/Khmertechreview" rel="nofollow" data-width="280" data-height="250" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"></div></div>

</div>

</div>

Customization

Time Delay: The Facebook Popup like box is set to appear on your blog 8 seconds after your blog is loaded. You may change it by changing the 8000.

Note: 1000 = 1 second.

Cookies Expiry Days: By default, this widget will appear if your audience visit your blog for the first time after setting this Facebook Popup like Box and it will load again after 10 days. If you want to load this widget whenever your visitor visit a page on your blog you may delete the line codes as shown below. If you want only to change the number of days before the cookies expire you may change only the 10 to your desired number of days.

$.cookie('popup_facebook_box','yes',{path:'/',expires:10})});

Facebook Page: The Facebook page set to the codes is the Facebook page of this site. It must be changed to your own page.

https://www.facebook.com/Khmertechreview

You may now test your Facebook Popup like Box by reloading your blog. If the widget failed to appear, just clear your browser’s cookies and reload again your blog. To clear the cookies just press Ctrl+Shift+Del on your keyboard, select cookies and click Clear browsing data button.

Thanks for Visit My Blogger, If You Like this Post Please share it to Your Friend.