Popup Facebook Like Box Dengan Timer CountDown Untuk Blogger

Widget Popup Facebook Like Box adalah widget yang dilengkapi dengan timer untuk menutup sendiri pada saat waktunya sudah habis dan mempunyai 4 jenis skin gambar yang berbeda-beda. Kotak like box popup ini akan muncul seperti jendela baru.  Selain itu widget ini juga dirancang untuk tidak muncul kedua kalinya jika pengunjung sudah mengklik like atau suka pada box.

Popup Facebook Like Box Dengan Timer CountDown Untuk Blogger


Bagaimana Cara Memasangnya ?

  • Login ke Blogger
  • Pilih Template » Edit HTML » Centang Expand Template Widget
  • Copy kode di bawah ini dan pastekan tepat di atas tag </body>
<!-- lostsector.blogspot.com Likebox Facebook Code Start -->
<style>
#fblikepop { background-color: #fff; display: none; position: fixed; top: 200px; _position: absolute; 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; 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: 14px !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://www.google.com/jsapi'/><script>google.load(&quot;jquery&quot;, &quot;1&quot;);</script>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 kakinetworkdotcom01username="lostsector.stars",
 kakinetworkdotcom01title="Join us at Facebook!",
 kakinetworkdotcom01skin="01",
 kakinetworkdotcom01time="15",
 kakinetworkdotcom01wait="0",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script src='http://yourjavascript.com/23312113212/www.lost-sector.net-popup-likebox-fb.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>
<!-- lostsector.blogspot.com Likebox Facebook Code End -->
Keterangan :
  • Lostsector.stars : Ganti dengan username fans page facebook yang Anda punya
  • Join us at Facebook : Silahkan disesuaikan
  • kakinetworkdotcom01time="15" : adalah waktu (seconds/detik) yang diperlukan sampai popupnya tertutup sendiri
  • Skin ="01" : Ganti dengan kode skin yang lain (01, 02, 03, 04). Contoh skinnya ada di bawah ini :
SKIN "01"
Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

SKIN "02"

Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

 SKIN "03"

Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

SKIN "04"

Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

  • Langkah terakhir, simpan template...!!!
    Semoga artikel kali ini bermanfaat dan jika ada saran ataupun kekurangan dari tutorial ini, mohon memberikan komentar di bawah. Terima kasih dan happy blogging...!!!

    Lost Sector
    Lost Sector

    37 comments:
    Write comment
    1. mantep mas infonya, di coba dulu

      ReplyDelete
    2. This comment has been removed by the author.

      ReplyDelete
    3. manatp mas,infonya kere, tp gmbar dsini http://kakinetworkdotcom.googlecode.com/svn/01/skin/ boleh dignti kan mas?

      ReplyDelete
      Replies
      1. Boleh...!!! Semua tergantung kreativitas sendiri mas...!!!

        Delete
    4. Thank u kakak infonya :D

      ReplyDelete
    5. thakss atas infonya...
      http://alwidpas4nizer.blogspot.com/

      ReplyDelete
    6. Gan , Gimana Cara Gnti Link Powered By Blogger Widget Yang Ini "http://www.lost-sector.net/2013/01/popup-facebook-like-box-dengan-timer-untuk-blog.html"
      Tolong Ya Gan Saya Ingin Mempelajari Developernya ...

      ReplyDelete
      Replies
      1. tanks ya gan , saya uda tau gantinya ...
        makasi atas tutornya
        Mampir juga Di Blog Saya Ya Gan http://chordt-and-music.blogspot.com/

        Delete
      2. Sorry gan telat liatnya, ok deh klo gitu...!!!

        Delete
    7. terima kasih,, jika tak mau ada button CLOSE atau X, nak buat bagaimana gan? pliz ajarin...

      ReplyDelete
    8. thanks gan, membantu , tapi saya belom bisa membuat page like nya, udh 2x tapi masi blum bisa muncul, singgah ya & follback at yosepriwm.blogspot.com

      ReplyDelete
    9. Saya masih gagal..tak dapat la..

      ReplyDelete
    10. kok kagak ada gambar nya Padahal dah tak Ganti 01-05 tapi gk muncul2 ,jadi gimana ini gan tolong info nya :D

      ReplyDelete
    11. gan , itu di ganti URL / Nama Fanspage nya? tolong di jawab thanks

      ReplyDelete
    12. http://cybernetwebdesign.com/order.php

      ReplyDelete
    13. http://seo.cybernetwebdesign.com/

      ReplyDelete
    14. mantap gan,,, ane coba dulu

      http://goodsinformation.blogspot.com/

      ReplyDelete
    15. Nice post Gan , Ijin Coba
      http://apknesia.blogspot.com

      ReplyDelete
    16. mantap mas, tutor berhasil :)

      http://appsapk-downloadz.blogspot.com/

      ReplyDelete
    17. gan kalo popup like yg ente pake? minta scriptnya dong :D d tunggu e-mailnya :D

      ReplyDelete
    18. izin copas kode nya ya gan...terima kasih banyak infonya,mau langsung praktek...

      ReplyDelete
    19. centang expand widget dimana gan??

      ReplyDelete
    20. Kok gx ada gambarnya gan, Lostsector.stars diganti Urlnya tau nama fanspagenya...
      lw ada waktu mampir gan.... http://sexscreet.blogspot.com/

      ReplyDelete
    21. Kok ga bisa sih ?

      Cek out : Alfianyusril.blogspot.com

      ReplyDelete
    22. Makasih sob untuk informasi tutornya :)
      http://goo.gl/I7YrK4

      ReplyDelete
    23. kok gambarnya gak kedetek ya

      ReplyDelete
    24. Hope I m not stupid, http://komedyatv.blogpsot.com , I don,t news (yerel haberler,illerin haberleri,online tv izle,canlı tv izle,metatags)

      ReplyDelete
    25. kok punya ane gag bisa ya , apa tema ane bermasalah tolong bantu gan
      www.immolite.blogspot.com

      ReplyDelete