Jquery Pop Up Facebook Like Box For Blogger - V3

Please Note - This is V3 of pop up facebook like box not custom facebook like box.

Facebook plays most important role in increasing traffic on your blog.You will watch facebook like box on every blog.After posting many widgets about facebook now I am posting a pop up widget for facebook like box with cool background image.Here I am giving a list of some facebook widgets.Actually this widget code was generated by Nitin Mehta - Making Different. So thanks to him...

View Demo 

List Of Some Facebook Widgets

• Custom Facebook Like Box - V1
• Custom Facebook Like Box - V2
• Pop Up Facebook Like Box - V1
• Pop Up Facebook Like Box - V2
• Floating Facebook Like Box
• Floating Facebook Like Retweet Widget
• Floating Facebook And Twitter Widget

How To Add Jquery Pop Up Like Box ?

Here are three steps to add Jquery pop up like box to your blog

Step 1 - Adding the Jquery plugin  

(Note - Ignore this step if you have already added the Jquery plugin)

• Go to Blogger Dashoard > Design > Edit HTML.
• Search for </head> tag and add below code just before it.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script>

Step 2 -Adding The Scripts

• Go to  Blogger Dashoard > Design > Edit HTML.
• Search for </head> tag and add below code just before/above it.

<script src="https://gj37765.googlecode.com/svn/trunk/html/[www.gj37765.blogspot.com]jquery.colorbox-min.js"></script>
<link rel="stylesheet" href="https://gj37765.googlecode.com/svn/trunk/html/%5Bwww.gj37765.blogspot.com%5Dfbpopup.css" 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:"600px", inline:true, href:"#mdfb"});
}
});
</script>

Step 3 - Adding The HTML.

• Now Go to Edit Layout > Add A Gadget > HTML/JavaScript
• Paste below code and save it

<div style='display:none'>
<div id='mdfb' style='padding:10px; background:#000;'>        
<center>
<table align="center" background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFBtgMmvjweFdPYj5rMI3xG7TLCbo5_2he2njVjWlBD0lGfs7sofW4J8LGFSwRCmKGY-IU-UiLm2M2Za2ULIsnAOHGVDc3skiolYTJxg3FyYnZkSuvF2mY03mg1rJGT5TkVyT7P2wnqE8Q/s1600/md123.JPG" border="0"  style="width: 465px; height: 300px; "><tbody>
<tr><td height="330" width="465">
<div align="left">
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript">FB.init("32eb3732082b27e7c314feb421a56208");</script>
<fb:fan profile_id="153138708123803" connections="10" width="330" height="300" css="https://gj37765.googlecode.com/svn/trunk/html/mddemo/[www.gj37765.blogspot.com]fblikeboxwithbgimg.css?"></fb:fan>
</div></td></tr></tbody></table></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.btsnts.blogspot.com">Blogger Widgets</a></p>
</div></div>

• Replace 153138708123803 with your profile username ID. If you don't know your profile ID then use our Facebook Profile Id Finder Tool.

That's it.