Widgets

How to add Facebook Pop Like Box With Timer In Blogger


Do you encounter a problem on how to advertise your online business? Facebook as one of the largest social networking sites is of a great help to every online marketer. The very reason is people around the world love to open this website. So as  blogger you want also to share and spread your content because no matter how quality is your post or your blog when it is not talked by people, you are just like wearing new and beautiful dress but intended for 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 web-site.org) . 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 customized.

facebook image

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/ </body>
<!-- Facebook Popup Like Box With Timer Starts by mybloggersnipers.blogspot.com -->

<script type='text/javascript'>

//<![CDATA[
    KNFBFansPRO='pages/Bloggingtipsandtrix/533310753378603?ref=hl'
 //]]>
</script>
<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='https://googledrive.com/host/0B9e7eeKnhqEVUFBGNGVKRkdHV3M' type='text/javascript'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script src='https://googledrive.com/host/0B9e7eeKnhqEVM3ppcFdvWkZPUEE' type='text/javascript'/>
<script language='javascript'>
//<![CDATA[
    $(document).ready(function(){                       
        $().KNFBFansPRO({
           timeout: 30,
            wait: 0,
            url: 'http://www.facebook.com/pages/Bloggingtipsandtrix/533310753378603?ref=hl',
            closeable: true        });
    });
//]]>
</script>
<div id='fbtpdiv'/>

<!-- Facebook Popup Like Box With Timer ends by mybloggersnipers.blogspot.com -->

Customization: 

  • 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.

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.


Take Care Friends!



No comments:

Post a Comment

Recent Posts

Related Posts Plugin for WordPress, Blogger...

Definition List