Add Facebook like button Easy
Today I am going tell you how to Add 1 time Facebook popup Like button to blogger .
Adding Facebook like button will surely help to increase your FB page Like
Follow these simple steps to add Facebook popup Like button to Blogger :-
1:-Login to your blogger >> goto Layout >> Click on Add a Gadget >> and Choose HTML/Java Script
2:-Don't Give any name Title name and put Code below in Code box
<style>
/*
ColorBox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
/*
User Style:
Change the following styles to modify the appearance of ColorBox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;opacity:0.5 !important;}
#colorbox{
box-shadow:0 0 15px rgba(0,0,0,0.4);
-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);
-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);
}
#cboxTopLeft{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) no-repeat 0 0;}
#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz_MGeWTQ9VRKCBTveLt8DMuqEn9gXJX-gXc_OGWUROFtwvt83BgVd_JWOEZWj8RpU2dOqLKD_A7-97BZ9Zo0CELrbjHbJrpIvqJjcbBSD9MIRwS22VCqyyn7ai9rhb_Zxq3iYsA77YJZT/s1600/border.png) repeat-x top left;}
#cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) no-repeat -36px 0;}
#cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) no-repeat 0 -32px;}
#cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz_MGeWTQ9VRKCBTveLt8DMuqEn9gXJX-gXc_OGWUROFtwvt83BgVd_JWOEZWj8RpU2dOqLKD_A7-97BZ9Zo0CELrbjHbJrpIvqJjcbBSD9MIRwS22VCqyyn7ai9rhb_Zxq3iYsA77YJZT/s1600/border.png) repeat-x bottom left;}
#cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) no-repeat -36px -32px;}
#cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) repeat-y -175px 0;}
#cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) repeat-y -211px 0;}
#cboxContent{background:#fff; overflow:visible;}
#cboxLoadedContent{margin-bottom:5px;}
#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjXTjYEco09j5gE-w7CZjo9rE4v3GejyoJyjIuz9PzUg-0yi0ZVMquRxs1Te1SzId_M0c9pXue_XzAkMfXuxM4GaG-Or5HtxliJZEsymukFM3ROesCBNxb00n8BVyvYb-a1T9XjCLEPqHp/s1600/loading-background.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC8cmggmWaMYv5GoY3jMsk0sFMAaiTPHuTmLeOLQBQ3gq4Na4N5QVDeKq5l15WbAaArwpEvtKymUdEkiVoMbiSZoYeqPEkFimj8UwqZk0HS8aR_pqHATJs2jDtyDF5PSWY0TVlHynmWUQk/s1600/loading.gif) no-repeat center center;}
#cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
#cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCCnzkNGCwqlbe24V3crhRfn5FZ51tI34a_8L4a8jWrQ_G09vthpCVWR2q2Njc-MHA9Jo4Wjo_G3kG7zWKQ17pQzGLE9wOyED4s0-df6LcVAOKWQ_yeOwB4Tb-IOXmIPerRtZnh2tqdAR/s1600/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
#cboxPrevious{left:0px; background-position: -51px -25px;}
#cboxPrevious.hover{background-position:-51px 0px;}
#cboxNext{left:27px; background-position:-75px -25px;}
#cboxNext.hover{background-position:-75px 0px;}
#cboxClose{right:0; background-position:-100px -25px;}
#cboxClose.hover{background-position:-100px 0px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
.cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}
/*-----------------------------------------------------------------------------------*/
/* Facebook Likebox popup For Blogger
/*-----------------------------------------------------------------------------------*/
#subscribe {
font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
}
#subscribe a,
#subscribe a:hover,
#subscribe a:visited {
text-decoration:none;
}
.box-title {
color: #3B5998;
font-size: 20px !important;
font-weight: bold;
margin: 10px 0;
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:10px;
line-height:25px; font-family:arial !important;
}
.box-tagline {
color: #999;
margin: 0;
text-align: center;
}
#subs-container {
padding: 35px 0 30px 0;
position: relative;
}
a:link, a:visited {
border:none;
}
.demo {
display:none;
}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script>
<script src="http://yourjavascript.com/11215013191/jquery.colorbox-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=true') == -1) {
var fifteenDays = 1000*60*60*24*30;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"400px", inline:true, href:"#subscribe"});
}
});
</script>
<!-- This contains the hidden content for inline calls -->
<div style='display:none'>
<div id='subscribe' style='padding:10px; background:#fff;'>
<h3 class="box-title">Receive all updates via Facebook. Just Click the Like Button Below<center><p style="line-height:3px;" >?</p></center></h3>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FVIKASH.BLOGS&width=300&colorscheme=light&show_faces=true&border_color=%23ffffff&stream=false&header=false&height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>
</center>
<p style=" float:right; margin-right:35px; font-size:9px;" >Powered By | <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://1vikash.blogspot.com/">Blog Gadgets</a> Via <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://1vikash.blogspot.com/">Blogger Widgets</a></p>
</div></div>
ex .. http://www.facebook.com/VIKASH.BLOGS = VIKASH.BLOGS
3:- Now all Done save and Enjoy
ANY PROBLEM COMMENT BELOW
Like this Post ??? Then Pls Support us LIKE US ON FACEBOOK OR Follow OUR Blog :)
Doesn't seems to work for me. Can u help??
ReplyDelete...
Where exactly did you place this facebook like button. I can't see it on your blog.
ReplyDeleteAre you not getting the popup of Facebook like button like as shown in above picture ,while loading the page ?? pls recheck it after 6-7 mins ,it is working and showing to me
ReplyDeleteWhat Actually I Have To Enter Ex:- I Have Some Page Like extra torrent for example so what should i add Extra.torrent or www.facebook.com/extra.torrent Like Which One
ReplyDeleteYou just need to add "Extra.torrent" Only
ReplyDeleteBro,Its Not Working I Have Tried Many Times This
ReplyDeleteDear Rizwan you just find " 1000*60*60*24*30; " and Replace with " 5*60*1000 " ,.you will start getting this in interval of 5 min instead of 1 day ,, hope this will help you to get appear on your blog
ReplyDeleteif my fb page link is this then what to change https://www.facebook.com/pages/Movies-in-HD/159857324025288
ReplyDeleteGo here to register yor fb page username without 25 likes and then try :- http://1vikash.blogspot.com/2012/04/easy-register-your-facebook-page.html
ReplyDeleteits not working for me.
ReplyDeletewhat should i place for my fb url
http://www.facebook.com/pages/Ncooltips/362303803781053
@Manohar Rao frist you go http://1vikash.blogspot.com/2012/04/easy-register-your-facebook-page.html and follow to register username for your page and then try..
ReplyDeleteGot it. Thanks.
ReplyDeleteI still find some problem in IE. the popup is not shown, instead my entire page is covered with the popup layer which is empty.
Do i need to add any checks in the code. please suggest me.
It is on www.ncooltips.com
got this error when i tried in IE.
ReplyDeleteWebpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30; InfoPath.2; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E)
Timestamp: Mon, 30 Jul 2012 19:54:48 UTC
Message: Object doesn't support this property or method
Line: 16
Char: 76364
Code: 0
URI: http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js
How can i remove it, i notice its increasing bounce rate on ma blog
ReplyDeletenot weorkiggggggggggggggg
ReplyDelete@DAAYUR YOU JUST REMOVE THE ADDED WIDGET ,ALL DONE
ReplyDeleteAND SONAM WHAT IS YOUR BLOG URL ..OR GIVE ME YOUR TEMPLATE AT vc8257@gmail.com
ReplyDeleteMy fb url is >>> www.facebook.com/androidusercommunity
ReplyDeleteSo what i have to put there ????? is there is any need to put "=" sign ???
Thanks kenul ..
ReplyDeleteand sorry this template is Fully Edited my myself not downloaded..so download link is not available to download
great work. http://pakeset4u.blogspot.com/
ReplyDeletethanks Md. Monirul Islam you are most welcome.. :)
ReplyDeleteIt worked for me thanks a lot here's my blog it works Emitez Blog make money online and more
ReplyDeleteDear can you say me how that? www.tuneit.tk
ReplyDeleteit's working
ReplyDelete