Blogger is one of the oldest platform for bloggers but now Wordpress handle big shares than blogspot.Many of professional bloggers migrate to Wordpress for more controls and options.Wordpress blogs are hosted in dedicated servers so users have more control over there blogs.Thousand of beautiful themes and plugins are available on Wordpress when we come to blogger this number is limited.One of the most useful plugin in Wordpress is Facebook Popup Box ,Facebook Popup box display while page load this will help them to get many Facebook fans.The same Facebook Like Box popup menu is also available in Blogger platform.Lets us discuss how we can add
1.Login to your Blogger account
2.Template ->Edit HTML ..or Apple older blogger interface then
Design-->Edit HTML
Apply this code in between
<head> </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'/>
<script src='https://gj37765.googlecode.com/svn/trunk/html/[www.gj37765.blogspot.com]jquery.colorbox-min.js'/>
<link href='https://gj37765.googlecode.com/svn/trunk/html/%5Bwww.gj37765.blogspot.com%5Dfbpopup.css' rel='stylesheet' type='text/css'/>
<script type='text/javascript'>
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=flase') == -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:"#mdfb"});
}
});
</script>
Example
 |
Facebool Fanpage popup box |
3.Layout-->Add a Gadget-->HTML/Java script (New Interface)
Design -->Page Element -->Add a Gadget-->HTML/Java script
Paste this code
<div style='display:none'> <div id='mdfb' style='padding:10px; background:#fff;'> <h3 class="mdbox-title">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=tp%3A%2F%2Fwww.facebook.com%2Fpages/7chipcom/152106238147822&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://www.7chip.com">Blogger Tricks</a></p> </div> </div>
Just Click the Like Button Below is text display with Box.You can change it according to you.
<div id="mdfb" style="background: #fff; padding: 10px;">
<h3 class="mdbox-title">
Which will give style to above text you can also change this
4.
pages/7chipcom/152106238147822
Replace it with your Fan page url
My Facebook page url is
https://www.facebook.com/pages/7chipcom/152106238147822
copy the last
7chipcom/152106238147822
and paste it above
Save it ,reload your blog
Labels: Blogger, blogging tips, Facebook, Facebook Popup Like Box for Bloggers