How To Add Facebook Popup (Like Box Widget) For Your Website Blogger

Facebook Popup (Like Box Widget) For Your Website Blogger

This is a fast way to increase facebook likes for your blog or website.  After Add widget to your website and a facebook like box will pop up with the lightbox effect when a user visits your page.  

Facebook Popup (Like Box Widget) For Your Website Blogger


How To Add Facebook Popup (Like Box Widget) For Your Website Blogger


Add Widget to Your Site

Step 1. Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link..

Step 2. After click on Add a Gadget link A pop-up box will open now
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget. 

Step 3. Select 'HTML/Javascript' and add the one of code given below. 


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script><style>#fbox-background {    display: none;    background: rgba(0,0,0,0.8);    width: 100%;    height: 100%;    position: fixed;    top: 0;    left: 0;    z-index: 99999;}#fbox-close {    width: 100%;    height: 100%;}#fbox-display {    background: #eaeaea;    border: 5px solid #828282;    width: 340px;    height: 230px;    position: absolute;    top: 32%;    left: 37%;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;}#fbox-button {    float: right;    cursor: pointer;    position: absolute;    right: 0px;    top: 0px;}#fbox-button:before {    content: "CLOSE";    padding: 5px 8px;    background: #828282;    color: #eaeaea;    font-weight: bold;    font-size: 10px;    font-family: Tahoma;}#fbox-link,#fbox-link a.visited,#fbox-link a,#fbox-link a:hover {    color: #aaaaaa;    font-size: 9px;    text-decoration: none;    text-align: center;    padding: 5px;}</style><script type='text/javascript'>//<![CDATA[jQuery.cookie = function (key, value, options) {// key and at least value given, set cookie...if (arguments.length > 1 && String(value) !== "[object Object]") {options = jQuery.extend({}, options);if (value === null || value === undefined) {options.expires = -1;}if (typeof options.expires === 'number') {var days = options.expires, t = options.expires = new Date();t.setDate(t.getDate() + days);}value = String(value);return (document.cookie = [encodeURIComponent(key), '=',options.raw ? value : encodeURIComponent(value),options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IEoptions.path ? '; path=' + options.path : '',options.domain ? '; domain=' + options.domain : '',options.secure ? '; secure' : ''].join(''));}// key and possibly options given, get cookie...options = value || {};var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;};//]]></script><script type='text/javascript'>jQuery(document).ready(function($){if($.cookie('popup_facebook_box') != 'yes'){$('#fbox-background').delay(5000).fadeIn('medium');$('#fbox-button, #fbox-close').click(function(){$('#fbox-background').stop().fadeOut('medium');});}$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });});</script><div id='fbox-background'><div id='fbox-close'></div><div id='fbox-display'><div id='fbox-button'></div><iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/bhatiyadevendra&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'style='border: none; overflow: hidden; background: #fff; width: 339px; height: 200px;'></iframe>>

.Step 4. Now Click On Save 'JavaScript' You are done. 


Note:- Replace Bhatiyadevendra With your Facebook User name


Post a Comment

Previous Post Next Post