HOW TO ADD POPUP LIKE BOX IN BLOGGER OR WEBSITE?

HOW TO ADD POP UP FACEBOOK LIKE BOX IN A SITE?

STEP- By - STEP Explanation

I have got many questions on how to add a pop up box with facebook like button on it.

A facebook like box is a very professional means to popularize an official page of a website.

It is some what tricky but not so Tricky as though.

So I will give you steps on how to add a Pop up like box in blogger and a website.

So here are the steps:-

(FOR BLOGGER)

Step 1 : Log In to Blogger

Step 2 : Click on Your site in the dashboard.

Step 3 : Click on "LAYOUT" option in the left hand side

Step 4 : Click On " ADD MORE GADGETS" on right-hand side

Step 5 : Search/Scroll for "HTML/JAVASCRIPT" And Click on "+" 'plus' button

Step 6: Then paste the following code in the empty box below the title:-

<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;'>&#9660;</p></center></h3>

<center>

<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Floveforgadgets&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258' style='border:none; overflow:hidden; width:300px; height:258px;'/>

</center><p style=' float:right; margin-right:35px; font-size:9px;'>Powered By <a href='http://funandhumor.blogspot.com' style=' font-size:9px; color:#3B78CD; text-decoration:none;'>Fun And Humor</a></p>

</div></div>

Step 7: You change the Red marked text with your "Facebook Page" -

AND the Blue Marked text According to your need.

Step 8: Leave the title empty.

Step 9: Click On "SAVE" 

Step 10: Now click on Template Designer>Edit HTML>Proceed

Step 11: Now search for "</head>", you can even type Ctrl+f and type "</head>" there.

Step 12: Now Paste the following code above "</head>" tag and then Click Save And you are complete with your adding of a Facebook Popup Like box.

<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(&#39;visited=flase&#39;) == -1) {
var fifteenDays = 1000*60*60*24*30;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = &quot;visited=true;expires=&quot; + expires.toUTCString();
$.colorbox({width:&quot;400px&quot;, inline:true, href:&quot;#mdfb&quot;});
}
});
</script>

FOR CUSTOM EDITING OF HTML SCRIPT IN BLOGGER FOLLOW THE STEPS:

Step 1: Log In to Blogger

Step 2: Click on Your site in the dashboard.

Step 3: Click on "Template" option in the left hand side

Step 4: Then click on " Edit Html" And then Click on "Proceed"

Step 5: Then find for the </body> end tag.

Step 6: Above the </body> end tag paste the given code and change those settings as stated in "Step 7"

of the previous section.

Step 7: Then click on "Save Template" and you are done with custom editing.

FOR WEBSITE OWNERS YOU CAN FOLLOW THESE STEPS:-

1) Just paste the shown script Above </body> end tag and change those settings as stated in "Step 7" of the 1st section.

HAPPY VIEWING "HOW TO ADD POPUP LIKE BOX IN BLOGGER OR WEBSITE?"

PLEASE COMMENT OR SHARE OR LIKE IN FACEBOOK.

Be a Fan