New Published Post: How To Fix Adsense Not Showing After Redirecting Blogger To Custom Domain
Like Us:

Add Facebook Pop Like Box With Timer In Blogger

adding facebook pop up with timer
Having a problem on how to advertise your online business. Facebook is the answer as it is the largest social networking  site. And as  blogger you want also to spread your content because no matter how quality is your content is but it is not being talked by people around the globe, you are just like wearing new and beautiful dress but just sleep in your bed.
As of the moment (when I wrote this article) it is the no. 1 in Alexa Rank having a 963,574,340 (data taken  from . In connnection with this,  FACEBOOK has provided the facility in shape of many widgets and boxes through which the webmasters and bloggers can easily advertise their blog or website and circulate it on the FACEBOOK. And now, in this tutorial I am going to share with you the “FACEBOOK POPUP LIKE BOX WITH TIMER”, which you can easily install in your Blogger Blog and attract more visitors and build a better fan following on the Facebook. The codes that I'm going to share with  you are highly customizable.

Live Demo

Add Facebook Pop Like Box With Timer In Blogger

Step 1. Log in to your Blogger Dashboard.

Step 2. Go to Template (have a back-up of your template for your reference).

Step 3. Click “EDIT HTML”.

Step 4. Inside “HTML EDITOR”, press “CTRL+F” and find  tag </body>.

Step 5. Copy &paste the following code below just above/before  tag </body>.
<!-- Facebook Popup Like Box With Timer Starts by -->

<script type='text/javascript'>
<style>#fblikepop{background-color:#fff;display:none;position:fixed;top:200px;_position:absolute; /* hack for IE 6*/width:450px;border:10px solid #6F6F6F;z-index:200;-moz-border-radius: 9px;-webkit-border-radius: 9px;margin:0pt;padding:0pt;color:#333333;text-align:left;font-family:arial,sans-serif;font-size:13px;}
#fblikepop body{background:#fff none repeat scroll 0%;line-height:1;margin:0pt;height:100%;}
.fbflush{cursor: pointer;font-size:11px !important;color:#FFF !important;text-decoration:none !important;border:0 !important;}
#fblikebg{display:none;position:fixed;_position:absolute; /* hack for IE 6*/height:100%;width:100%;top:0;left:0;background:#000000;z-index:100;}
#fblikepop #closeable{float:right;margin:7px 15px 0 0;}
#fblikepop h1{background:#6D84B4 none repeat scroll 0 0;border-top:1px solid #3B5998;border-left:1px solid #3B5998;border-right:1px solid #3B5998;color:#FFFFFF !important;font-size: 13px !important;font-weight:normal !important;padding:5px !important;margin:0 !important;font-family:&quot;Lucida Sans Unicode&quot;, &quot;Lucida Grande&quot;, sans-serif !important;}
#fblikepop #actionHolder{height:30px;overflow:hidden;}
#fblikepop #buttonArea{background:#F2F2F2;border-top:1px solid #CCCCCC;padding:10px;min-height:50px;}
#fblikepop #buttonArea a{color:#999999 !important;text-decoration:none !important;border:0 !important;font-size:10px !important;}
#fblikepop #buttonArea a:hover{color:#333 !important;text-decoration:none !important;border:0 !important;}
#fblikepop #popupMessage{font-size:12px !important;font-weight:normal !important;line-height:22px;padding:8px;background:#fff !important;}
#fblikepop #counter-display{float:right;font-size:11px !important;font-weight:normal !important;margin:5px 0 0 0;text-align:right;line-height:16px;}</style>
<script src='' type='text/javascript'/>
<script src='' type='text/javascript'/>
<script src='' type='text/javascript'/>
<script language='javascript'>
           timeout: 30,
            wait: 0,
            url: '',
            closeable: true        });
<div id='fbtpdiv'/>
<!-- Facebook Popup Like Box With Timer ends by -->

  • Change the red highlighted texts with your facebook username or facebook fan page.
  • If you want to hide your facebook fan page name because it is odd to look especially if it contains many numbers, simply delete the 13px   in font size in the above code and change it to zero (0).
  • Set the  time-out  (in seconds) by replacing 30 with your own.
  • This widget will  reappear after few minutes. Simply change the  (0) with 1, 2, or any time you want.
 In my case my complete facebook fan page is

Step 6. Click Preview to see the initial effect then hit the Save button.
As a token of this article please like my facebook fan page. Thank You!
Peace and more blessings to your family.
About the Author:
tilt  hover effect
Hello folks! This is Viral Apps, the admin of this blog. No words could described my grateful appreciations to all newbie and professional bloggers around the world and most especially to Almighty God who gave me the wisdom...Read More
Follow him @ Twitter |Facebook

No comments :

Post A Comment!

Post A Comment!
We love to hear your feedbacks and suggestions. We will try our best to reply to your queries as soon as time allows. Please keep in mind that all comments are moderated manually by our editors team to minimize spamming, and all the links are nofollow.

1. To add HTML code in the box, please use our HTML editor generator.
2. Please do not spam. Those type of comments will be deleted upon our review.
3. We should appreciate an individual and suggestive discussion.

Best Regards,

Cerwenlloyd Gefjun

Related Posts Plugin for WordPress, Blogger...