Facebook Popup Window Will Helps You to Increase Your Facebook Page's Fans As Well As it is very Useful in Getting Traffic From the Facebook to your Blog. The Main Feature of this widget is it will Appears After 20 Seconds of the Page Load Time.And Another Feature is It will Not Slows Down Your Site Speed and it will not Reduce Your Visitors Page Views too. Because Once You Have Closed this widget Then it Won't Appear Again on the Blog For the Same Visitor. Simply We can Tell Its a One Time Popup Widget Per Person.
How to Add it into Blogger?
Its Very Simple To Add.
1. Goto Your Blogger Dashboard.
2. Then Click on Layout
3. Now Click on Add a Gadget --> HTML/JavaScript
4. Now Paste the Below Code in the Content Area and then Save.
5. Replace the gobloggertricks With Your Facebook Username and Then Save it.That's It You Are Done.<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script>
<style>
#abt-back {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#abt-exit {
width:100%;
height:100%;
}
#abt1 {
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;
}
#abt-fb-popup {
float:right;
cursor:pointer;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNDrn1U0lf_iYNDDAhzk27vGY9pIDqFeHaEnQSNl2Fgt1TcW6RZ5jvV8gqxUDYaQ7Z3SUgCQIdDPnOL_xr5FDYs0KhuN0fYd0-oTKDWGEOqgK8R8ioZV6pNtBXVl0maImr4RsNaHySXu8/s1600/close.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.abt-fb-like {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit,#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) {
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() : '',
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
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'){
$('#abt-back').delay(20000).fadeIn('medium');
$('#abt-fb-popup, #abt-exit').click(function(){
$('#abt-back').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='abt-back'>
<div id='abt-exit'>
</div>
<div id='abt1'>
<div id='abt-fb-popup'>
</div>
<div class='abt-fb-like'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=http://www.facebook.com/gobloggertricks&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>
<span id="linkit"><a href="http://www.gobloggertricks.com/2014/07/how-to-add-pop-up-like-box-in-blogger.html">Get This Widget</a></span></center>
</div>
</div>
0 comments:
Post a Comment