What's going on guys, welcome to howbid. It's +M Abid Khan with new amazing Widget for my Blogger users "Facebook Po...
What's going on guys, welcome to howbid. It's +M Abid Khan with new amazing Widget for my Blogger users "Facebook Pop up Like box for blogger". Guys, as you know Facebook is one of the most popular social networking platform nowadays so every one is making their business/personal pages on Facebook to promote their content, product or services. Because nowadays Social Networks are more powerful then TV or Radio, because 80%+ majority of peoples of the world are using social networking sites. So in this tutorial I'm going to share a Facebook popup widget which is one of the best widget use to get more likes on Facebook Page :) Easily. So guys Enjoy
but don't forget to hit on Like button, Comment your experience on our blog and to share this content. :) Thank You
Below is the instruction of how to add Facebook Pop up.
Step no 1 : Login to your blogger account, go to Layout and add a new gadget and select HTML/JAVASCRIPT.
Step no 2 : Now Paste the below code to this new widget.
Step no 2 : Now Paste the below code to this new widget.
<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 IE
options.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/abidkapage&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>
<div id="fbox-link">Powered by <a style="padding-left: 0px;" href="http://howbid.blogspot.com" rel="nofollow">HowBiD</a></div>
</div>
</div>
Now Just Replace Facebook.com/abidkapage with your Facebook page Link This widget will appear after four seconds as a default time, to change time change the value .delay(4000) to your own timing. 1000+ 1 second.
This widget will only appear when visitor visits your blog homepage as a default, to make this widget appear on all pages of blog then just remove the below line from the code.
like, Comment and Share.
This widget will only appear when visitor visits your blog homepage as a default, to make this widget appear on all pages of blog then just remove the below line from the code.
Enjoy :)$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
like, Comment and Share.