Welcome to 434Tuto!

Meet the Author

The author is a man to whom Teknology like it. this blog can get different insights on: Blogger's, programming languages etc.

Looking for something?

Subscribe to this blog!

Receive the latest posts by email. Just enter your email below if you want to subscribe!

Tuesday, July 1, 2014

How to Add Facebook Like Popup Box for Blogger


Today we provide you new blogger tips to add facebook like popup box for blogger. Some time ago we discussed about how to add like box widget in your sidebar now we provide you full step by step guide to add popup like box widget for blogger to increase more facebook likes of your facebook fan page. This facebook like box appear after your site or page load.


Add Facebook Like Popup Box widget for Blogger

 Follow below steps to Add Facebook Like Popup Box widget for Blogger:
Step 1

Log in into Blogger Dashboard.
Step 2

Go to Template and Click on Edit HTML Button as shown in below picture.
Step 3

Find below Code With the help of CTRL+F
</body>
Step 4

Copy and Paste below code before </body>:

<style type='text/css'>#haakblogFBpop {position:fixed !important;position:absolute;top:-1000px;left:50%;margin:0px 0px 0px -182px;width:300px;height:auto;padding:16px;background:#FEFEFE;font:normal Dosis, Georgia, Serif;color:#111;border:2px solid #333;-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);box-shadow:0px 1px 2px rgba(0,0,0,0.4);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}#haakblogFBpop a.haakblogclose {position:absolute;top:-10px;right:-10px;background:#fff;font:bold 16px Arial, Sans-Serif;text-decoration:none;line-height:22px;width:22px;text-align:center;color:#000000;border:2px solid #333;-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);box-shadow:0px 1px 2px rgba(0,0,0,0.4);-webkit-border-radius:22px;-moz-border-radius:22px;border-radius:25px;cursor:pointer;}</style> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'/><script type='text/javascript'>$(window).bind(&quot;load&quot;, function() {// Animate Top$(&#39;#haakblogFBpop&#39;).animate({top:&quot;150px&quot;}, 1000);// Widget by www.haakblog.com$(&#39;a.haakblogclose&#39;).click(function() {$(this).parent().fadeOut();return false;});});</script><div id='haakblogFBpop'><!-- Widget by www.haakblog.com Start --><center><b>Don&#39;t Forget To Join US Our Community</b></center><center><iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fhaakblog&amp;width=300&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=false&amp;header=false&amp;appId=196282097100252' style='border:none; overflow:hidden; width:300px; height:258px;'/></center><!-- Widget by www.haakblog.com End --><a class='haakblogclose' href='#'>&#215;</a><center style='float:right; margin-right:10px;'><span style='font-size:xx-small; color:#000; text-decoration:none;'></span><a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="blogger tips"><img src="https://bitly.com/haakblog" alt="blogger tips" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://www.haakblog.com/2014/02/download-best-blogger-templates-of-2014.html" rel="dofollow" target="_blank" title="blogger templates"><img src="https://bitly.com/haakblog" alt="blogger templates" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href='http://www.haakblog.com/2013/10/add-facebook-like-popup-box-for-blogger.html' style='font-size:xx-small; color:#3B78CD; text-decoration:none;' target='_blank'>Widget</a></center></div>

Change HaakBlog to your Facebook Page Name
Step 5


Click on Save Button.

0 comments:

Post a Comment

 
Back to top!