Awesome Facebook Like Box Popup Widget For Your Blog Or Website
Adding a Facebook Like Box popup widget to your blog or website is a great way to increase your facebook likes and really helps you to build your social audience and this results more traffic to your blog or website. There are so many positive resons to use a like box popup on your website or blog and see how faster your facebook likes are increases. Today in this article I am going to share you a awesome facebook likebox popup widget you can use it in your blog or website.
You might also like this :: How To Add Facebook Recommendation Bar to Your Blogger Blog
You might also like this :: How To Add Facebook Recommendation Box to Your Blog Or Website
Add Facebook Likebox Popup Widget To Your Blog Or Website ::
Here I am going to share code of facebook likebox to add this widget on our blog or website you just need to copy the code and paste it into the <head></head> section of your HTML coding. Before going to do this you need to do some modification like have to chage facebook page url and loading time of widget. Here I explain everthing you just follow the procedure that is given below :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style>
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#fanbox {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#fanclose {
float:right;
cursor:pointer;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglWKcdoVrxWP7Ql7rbhoSN7MEpNSp-DZ22G9bn2i1gvDwYzk2bM0VMEdTxliJzqr5AIssiIFsym-3qy2DHprfr4nmN3p9MTfMb76WynguGSl-a6enUJ-oVPhDlTUj-ZxCmimjmCfhSfQu4/s1600/fanclose.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit a.visited,#linkit a,#linkit a:hover {
color:#80808B;
font-size:10px;
margin: 0 auto 5px auto;
float:center;
}
</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_user_login') != 'yes'){
$('#fanback').delay(30000).fadeIn('medium');
$('#fanclose, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='fanback'>
<div id='fan-exit'>
</div>
<div id='fanbox'>
<div id='fanclose'>
</div>
<div class='remove-borda'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/altechmantraa&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe><center>
</center>
</div>
</div>For adding this code blogger ::
- Goto Your Blogger Blog Dashboar
- Select Layout
- Add a Gadget > Select the HTML/JavaScript Gadget
- Paste the code that is given below into the HTML/JavaScript Gadget.
You might also like this :: How To Setup Domain Name To Your Blogger Blog With Godaddy
You might also like this :: Importance Of On-Page SEO or On Page Optimization
Customize the Widget ::
1. Change Facebook UserName ::Change the red highlighted facebook username with facebook page' username.
Search for this ::
https://www.facebook.com/altechmantraa
and replace it with your Facebook Page url.2. Change the delay time(if you want) ::
You can also change the box uploading time that is when it will load after loding your page. By default here it will show up on your page about 30 seconds after the page loads but you can customize it by changing the delay time.
Search for this ::
delay(30000)
here 30000 = 30 seconds means 1000 = 1 secondnow chage it according to your convenient and you have done it...:-)
You might also like this :: Importance Of Off-Page SEO or Off-Page Optimization
From the Editor’s Desk
So friends steps are very clear just grab this widget and use it on your web property. And if you face any problem then feel free to ask me via comments.Thankyou for giving your time.
Awesome Facebook Like Box Popup Widget For Your Blog Or Website
Reviewed by Team tt24
on
11:15 PM
Rating:
Reviewed by Team tt24
on
11:15 PM
Rating:
No comments: