February 29, 2012


Facebook LikeBox JQuery Popup with Timer!

imageWe have published so far two versions of Facebook Likebox Jquery popups (Version1 | Version2) and today we are sharing another version with much more control options. This one includes a time counter and instead of likebox it displays a like button that links to your Fan Page and an attractive Image that also links to your fan page letting your visitors to either join your fan page by clicking the like button or by simply visiting your fan page by clicking the image. You can set for how long the widget/plugin must display before disappearing automatically. It also includes a close option. You can also specify whether you want it to show immediately as soon as a visitor enters your site or after a specified time. The JavaScript code for this plugin is created by kakiheboh termed as "LikeBox FB Fanpage Pro"  and we simply modified the code to create four different backgrounds for the likebox. The installation is extremely easy just follow these steps. This one comparatively loads faster compared to the previous facebook blogger widgets we published so far. 

Live Demo

Add Facebook LikeBox Popup To Blogger

This popup contains a likebutton instead

  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Paste the following code just above </body>

<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:18px !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='http://mybloggertricks.googlecode.com/files/jquery.js' type='text/javascript'/>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>

<script src='http://mybloggertricks.googlecode.com/files/mbtlikebox2.js' type='text/javascript'/>

<script language='javascript'>
           timeout: 30,
            wait: 0,
            url: 'http://www.facebook.com/BloggerTricks',
            closeable: true        });
<div id='fbtpdiv'/>


Make these important changes:

  • Replace this BloggerTricks with your Facebook username.
  • The timer is set to 30 seconds to change it simply edit timeout: 30
  • The widget appears immediately after a visiter eneters. If you want it to appear after one minute or more then edit wait: 0

Change Facebook FanPage Background Image:

The above code displays the following image:


To use the following images, simply replace http://mybloggertricks.googlecode.com/files/mbtlikebox2.js with anyone of the given links







like us on facebook


Add Facebook Likebox Popup To Wordpress

Simply copy the above code and paste it juts above </body> inside your wordpress theme. You can find this tag inside your Theme settings. For those who you Genesis Framework, you may simply paste this code above </body> by going to Genesis > Theme Settings.

Need Help?

The steps are self explanatory and it works just smoothly without any troubleshooting. Add it to your blogs to increase your Facebook fan followers and drive more and more traffic from this giant social media network with over 800 Million registered users. Do let me know if you needed help. Peace pals! :)

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

155 comments : Post Yours! Read Comment Policy ▼
We have Zero Tolerance to Spam. Chessy Comments and Comments with Links will be deleted immediately upon our review.

  1. Great One :)
    I really loved it ......

    I e-mailed you the problem with the picture .......

  2. Nice one but each time I use it, it will affect my drop-down sidebar menu(shows featured Jobs and the rest). Please check my weblog and advice me what to do?

    My blog http://www.naijaguardianjobs.com/


  3. thanks, this is what I needed.

  4. This comment has been removed by the author.

  5. edited wait to 120 but it loads immediately only. Please guide.

  6. This comment has been removed by the author.

  7. when we edit timeout and wait,then also appears immediately and neither show close option nor waiting seconds

  8. Hello admin.Your article is great but i want only one time window popup.Please do something :-)

    1. Did you get an answer to this question? I would like to use this but only want the popup once.

  9. its not work with me


  10. i want that it should appeear a little more down how to change its position??

  11. Can you plz tell us how to create just like you the mbt code bar written blue line vertical.. i hope you understand

  12. Ola amigo, Hi friend, very good this box, muito bom mesmo

  13. its displaying JOIN MYBLOGGERTRICKS and below them is my facebook fan page ,so how to change mybloggertricks with my name ?

    blog is : www.StudentsCrunch.com

  14. i want it to use in my website
    how can i use,help me

  15. It looks fine. I am going to try this with my design blog.

  16. very nice...........


  17. thanks you admin alayına isyan hepsine mokoko thanks you
    sohbet odaları

    saolun varolun

  18. very important and nice sharing,
    i will apply this on my blogger because now i am on travel and having iphone.
    see your blog soon.

    Facebook App Developer | Facebook Game Development

  19. bro it worked fine for me but another bug is coming when i added this java script in my blog. My slider stop working! :( what will i do? :(

    This is my blog:- http://thecybertutorials.blogspot.com

    Can you help me bro?

    Thanks in advance!

  20. close button not working...
    check my Blog : www.googlefanz.blogspot.com

  21. it shows in every page..that will be so irritating for visitors..how can i show it only once when a visitor visits my blog?

  22. This comment has been removed by the author.

  23. Does placing this widget on the first visit on my blog will affect my seo/rankings on google?

  24. Anxiously awaiting a work around for this to only appear once per however many days we set like the other one you wrote about.

  25. thanx for this trick ..it did help me much....

  26. Please make a Similar Subscription Pop up Box for Blogger , I have checked the aweber one you guys provided but that's not upto the mark and i want a widget from you .

    This is awesome but i was Looking for a Pop up subscription box Please if possible create it .....I have High hopes from thsi and wonder why have not you created it yet ?

  27. This comment has been removed by the author.

  28. I rechecked the code that was causing the widget to wait before it appears but somehow the code is dead and does not work though other options are working fine.

    As soon as I get some time I will publish version 2 of this widget with changes to javascript. Explaing it here would be comprehensive. I will make sure the widget appears only once and wait time may work.

    Some of you requested tutorials for Blue headlines that I use in my posts. I will publish a tutorial on it tomorrow soon.

    Subscription box widget have already been published at version2 but we will create more better designs for that widget in coming days. All new requests have been noted down.

    Thanks a lot for liking this little gadget. :)

  29. I have 2 Website

    1. Fullsoftdl.com

    And Another that i have recently created . Via Blogspot .

    But when i am Putting This Html/Javescript

    it is not comming What to do Please Guid me

    Here my Personal Id : Support@fullsoftdl.com

    Anyone Help me !

  30. not working to me nothing happens ??? check Please help http://mobilemillion.blgspot.com/

  31. @bishal

    It wont work in HTML/javascript widget. Add it directly inside your template as guided


    You website is not blogger based. It will still work if you add it after the opening body tag

  32. I like the popup but how can I make it to show say every 7 days?
    Popping up on every page refresh is really annoying even to myself.

  33. Hello , Its very Cool but has one problem, it has conflict with my jquery tools such as slideshow and others pop up slider. do u have any solution? thanx :)

  34. Nice job but i don't want it to appears in all my pages but only in the first page.Please tell me how to do this.

  35. Admin, close button doesn't work. Dnt know why. please can you check what is the problem. I think some people are getting this problem. Your reply will be great help for me. Thanks.

    website: www.funsms94.blogspot.com

  36. Hi Mohammad there is a problem coming in my blog everything funtioning well only the problem is the wait seconds are not functioning.Please give me some suggestions to resolve this problem.


    Thanks & regards

  37. Mohammad Mustafa Ahmedzai,

    Brother i am sorry i was not clear or of i have misunderstood , But i am asking for a POP-UP subscription box not static boxes ..Just like you have created this AWESOME Facebook pop up which is really very much appreciable , I want a similar pop-up for Subscription .

    Also as you said "Subscription box widget have already been published at version2" i Doubt whether it was a Pop-up or static one and if it was a Pop-up i would love to have that link of the blogpost ..

    I was able to find the Aweber popup subscribe box which was a really good one but that does not seem to work now and i was wondering if we can see it from your hands with great design .

    Cheers and thanks for all you do , No one can do that if a person is not passionate , Truly admirable !

  38. Thats correct the wait function is not working and I am working on it. I am a little busy with some incomplete tasks. I will get back to this tutorial very soon releasing a better version.


    Close button is working fine on all blogs. Kindly try it on your test blog first and then apply it to your main blog. :)

    Oh thanks for your kind and motivating remarks NJ. Well yes I did publish a simple design for likebox along with subscription box inside it. You can find the tutorial here. I will be publishing more versions of it very soon.:)

  39. Nice post mohamad. Its very cool widget. This will surely increase the like on facebook page.

    Visit My Blog: ShineMat.Com

  40. @Mohammad Mustafa Ahmedzai
    Bro It's still not working do i need to change my template and which is the best template for my site : android apps/games ???
    which look like my installed template??
    and can you please email me memonvicky007@gmail.com

  41. it gr8 i am using on my blog

  42. bro i found this one ..http://conventy-btheme.blogspot.com/
    can i change its background color and will these jquery widgets works on please help....... please must reply

  43. How to avoid the pop up from keep popping every time we clicking to other URL in the blog?

  44. Wont this work for Blogger dynamic views templates??????

  45. Thanks for the script.It works pretty well in my blog

    one thing, i have a problem in dealing with the comments in blogger..i need to have some pagination... :(

  46. Hello.. admin.Your article is great but i want only one time window popup.Please mail to me how to do that. hotnewsowner@gmail.com

  47. hi, i have problem with that i have set timer to 0 and enabled the close, but it doesn't appears in chrome , mozilla, but appears in properly in ie 9, i have also changed the css code for #closable and set it to color:red; font-weight:bold;.

    But not appearing any idea?

    my site www.nsmtechie.com

  48. This comment has been removed by the author.

  49. Wow it totally working on my blog ! That's cool. Keep up the good work! I love reading articles in this blog.
    From 1malaysianews.net

  50. Awesome!!! Just check out why I love MBT... visit My Site and see the reason.


  51. mind blasting
    thanks for this dude


  52. thanks.. its working... i love it..

  53. hy admin its gud i had added it my site but my i have reason, my jquary media bar scroler did't work proper after apply your tutorial and also did't work light box effect on images plz visit and tell me the soloution,,,,www.Shaan-ali.blogspot.com..and email me if u can at shaan.skpweb@gmail.com

  54. this widget is super awesome that what i was looking for
    But i have problem with jquery code conflict when i instal this code to my template my slider stop working
    i did try to delete this code <.........http://mybloggertricks.googlecode.com/files/jquery.js' type='text/javascript slide.........> slider starts working fine but facebook like box dosnt popup :(.... same problem with my back to top button ... if anyone know hot to fix this problem please let me know...

  55. is anybody going to help ? i am really need help to resolve this problem if anybody have idea how to fix jquery code conflicts PLEASE CONTACT ME ...

  56. I Want This For HTML-CSS Website...???
    What Should I Do?

  57. Very nice pop up timer widget but how to add pop up with hover effect facebook like box

  58. I strongly support this script. however, I do not really like the look of the pop up window appears when opening a new page. how to set up the popup that appears only once when opening the blog. because it could make visitors uncomfortable blog. please help with this problem. Thank you.

    contact me at YM: ngecamp, G + budiseplawan or my blog

  59. great widjet
    great work
    i have 2 problems
    1. the close button doesn't appear
    2. if you click the logo, it directs you in wrong address

  60. We want only one time window popup please Mr.Admin..Thanks


  61. somehow it dissapeared after working for sometimes

  62. close button not appears
    plz help

  63. This comment has been removed by the author.

  64. This comment has been removed by the author.

  65. Hii, i just tried to use it in my blog but its not working no LIKE button is there plzz help

    here is my blog

  66. its worked for me!!!!!!!!!!
    thanks for this wonderful post ,
    the pics of liked people doesn't appear in the pop up box , how to make it visible

  67. i found a way to make pics visible in popup fb like box
    i have changed the value of "height30px to 60" in the following line , and change the timeout to some extend to load the pics in pop up box .. "timeout to 60"

    #fblikepop #actionHolder{height:60px;overflow:hidden;}

    now the pics of of liked people are visible cleanly , check my site

  68. Hola cuando le dan like al popup les vuelve a aparecer a los usuarios. Como le hago para que cuando le den click en Like ya no les vuelva aparecer ?

  69. Would you mind to add subscribe button near by LIKE button? please replay me as soon as you get my comment! Thanks

  70. Thanks for sharing your info. I really appreciate your efforts and I will be waiting for your further write ups thanks once again.
    html5 video hosting| html5 hosting

  71. This comment has been removed by the author.

  72. This comment has been removed by the author.

  73. hii dude i want some help. please tell me how popup ads in blog....i see in some blog that when some buddy enter in those blog and click any where in blog page then some ads open automatically ..how they edit html for this type pops...plzz help me..

  74. hii dude i want some help. please tell me how popup ads in blog....i see in some blog that when some buddy enter in those blog and click any where in blog page then some ads open automatically ..how they edit html for this type pops...plzz help me..
    this is my blog thehackeroftheworld.blogspot.in

  75. There is a problem in popup of fan page that it popup if any one like it already ..plzz tell me how stop pop if some buddy like my fan page ..
    My blog thehackeroftheworld.blogspot.in

  76. I have the same problem, the code does not check whether the person is actually a fan and do not write to the cookie. As a result, the person still appears to have been a fan. The script is wonderful and I hope that this will be corrected sometime :) Great job.

  77. Hey Bro!! thanks It helped me alot!!!

  78. I really appreciate your post. It gives an outstanding idea that is very helpful for all the people on the web.



  79. please make this this pop up only on home page..it is irritating to visitors!

  80. Assalam 0 Alikum, Mohammad Bro! You are awesome, i have added both facebook likeboxes, 1. this one, and 2. Facebook likebox Slider, both are working smoothly.

    Here's my blog Urdu Poetry

  81. Thanks for this! I've searched a lot for the FB pop-ups but found this one as the best! How can I set the pop-up to appear in just one page? Hope you'll be able to work on it soon. Many thanks!


  82. I successfully added it there, http://curioussoft.blogspot.com/

  83. Thanks i am looking to implement it on wordpress will the popup load only once i want it to show to a user only once he enters the site not every time

  84. it is not working on my wordpress blog http://neeshu.com can you see the theme and tell my why it is happening i copied and pasted the code below the starting body tag

  85. Wow nice snippet. i will use this on www.klixindia.com

  86. i like it
    visit back jogja-mp3.blogspot.com

  87. great!

    Cricket gaming Mods & Patches (IPL5 Patch)

  88. please visit to my portfolio artwoks blog :)

  89. WoW .. Nice Article ^^ I like it ,.

  90. its pop up every time.. how fix to one time?

  91. hm... it is similar to this fbcontentlock(dot)blogspot(dot)com
    btw, thanks MBT =D

  92. YOu are just awesome dude thanks. thanks for this amazing help. I went to the site but wasn't able to get it right

  93. Add in the very important; but I think coercion is bad for the visitor
    Blogger To Free

  94. i cant see close option.. so i removed this widget. check once or come up with new one by modifiying this. ThanQ

  95. hey admin, i loved your like box but unfortunately it pops up again after each page refresh and it gets really annoying. what to do??

  96. hey dude there is a bug in this one,in my custom template it made Jquery slider to stop working when i added and as soon as i deleted this script slider started working

    checkout once http://copycatsrevealed.blogspot.in

  97. i have the same problem, Slider doesnt works when i add this script.

  98. i want a combination pop out box with rss subscribe and fb like can u plzz help me out

  99. I tried but not done at http://www.touristscountry.com/

  100. took me 3 days and had to mix up some others code and still the code isn't perfect becauser likers still see the popup and get only 10min break.. not acceptable

    they can't get they need to undo and relike to get a one month popup free.

    so it s pretty tough to implement this (i m speaking of a website)

    if u see the popup like me always coming back, it s because the cookie isn't setup by the script. that was the big challenge for me

  101. Hello I cant seem to get either of the 3 codes for the popup boxes to work in the html widget I copied and replaced it for all 3 styles and just does not work for me any clues why

  102. if u see the popup like me always coming back Surf Movies

  103. Wow your blog is so wonderfull ... i love
    please check my blog


  104. It doesnt work on my blog http://www.rhipplemedia.com/, any idea how I can fix it?

  105. This comment has been removed by the author.

  106. I'm loving your blog, thank you for everything. turk chat

  107. why it does not work on my blog ? what is timeout ? what is wait ?

  108. hi
    thank you so much for this tutoria
    i have a question , i want to add this code just to appear in a specified page not all the blog , so please can you help me out for this one

  109. @Admin

    ah i gorgot , i'm using wordpress

  110. i have tried all facebook popup like box v1 ,v2 ,v3 on my blog but none of them is working www.evilarslan.blogspot.com please help me..

  111. I did like the script, but I want it to use my own “APP ID” instead the generic FB app id when people clicks on like, which then redirects to FB Login Screen (where its the FB Generic App ID) So I wanna use my own instead? Possible.

  112. Nice Info... thanks..
    Please visit :http://www.komputermedia.com/

  113. It is not working in my blog....please help me.

  114. Not Working On Ma Blog :(


  115. How can I darken more the site during the opening of the window?

  116. How can I darken more the site during the opening of the window?

  117. This comment has been removed by the author.

  118. This comment has been removed by the author.

  119. Hi! This Pop-up Facebook Likebox is really helpful. It helps my blog's FB Page to reach 5,000 likes. But one day, the pop-up stops working and I couldnt find the reason why. Can you please help me. I really want this pop-up to work again in my blog.
    Here's my blog: http://www.allanistheman.blogspot.com/


  120. din't work with my blog

  121. thank you for this tutorial, i will make an article about this in Indonesia with my own word, this website is the best references for many blogger.

  122. It's not working with my blog: http://www.amschoirs.blogspot.com

  123. Same, not working with my blog neither: http://www.tipsgraphdesign.com/
    Please upgrade the new tricks if you do have time, thanks :D

  124. Fix this please. It doesn't work.

  125. Thanks for sharing out such a great informative content are extremely fastidious.
    buy facebook followers here

  126. Great blog you people have made here on this blog site, I will absolutely appreciate your work.pirater un compte facebook

  127. Your blog is such like that I have run out of words!!! Really superb
    bubblegum casting

  128. Thanks admin its really a good and hardworking job currently doing you are. This help me a lot to get more likes on my Facebook page, Thanks again. Visit http://www.filmaxtv.com 4 watch UK, USA Worldwide HD Tv channels online Free :)


Support Us

We have educated thousands of bloggers online and made several people Make a living Online. If our Tutorials have really helped you a little, then kindly show your love by using the badge below:-

Blogger Widgets

or try a Beautiful Banner


  • MBT Icons and buttons

    Icons and Buttons

    Our resources have been successfully downloaded over 10K times and found almost every where. Get yours!

  • choosing webhost for a blog

    Why HostGator?

    Learn Why we chose HostGator as our Web Host and find discount coupons to kick start your blog today!

  • SEO Settings for blogger


    Learn every single SEO tip that will boost your blog's ranking and organic traffic. We got them all!

  • Blogger widgets and plugins

    Visit MBT's Blogger LAB

    Why not take a tour of all great Blogger widgets published so far? You Name it we have it!

  • become a six figure blogger!


    Learn what it takes to become a successful entrepreneur and build a living online!

About The Author

Hi! I am Mohammad, a certified SEO Consultant, Pro Blogger, Computer Engineer and an addicted Web Developer. STC Network was founded in 2008 and it is currently the country's first registered company of Professional Bloggers. Read More..


SEO Affiliate Marketing Social Media

Make Money Online Web hosting

Blogging Tips Web Designing

Plugins and Widgets Blogging Ethics


Recent Comments

Popular Series

Powered by:

My Blogger Tricks © 2013. All Rights Reserved | Contact |