Popup Facebook Like Box Dengan Timer CountDown Untuk Blogger

Widget Popup Facebook Like Box adalah Widget yang dilengkapi dengan timer untuk menutup sendiri saat waktunya 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 kedual kalinya  jika pengunjung sudah mengklik like atau suka pada box.

LIVE DEMO

Bagaimana cara memasangnya ?

• Log in ke Blogger
• Pilih Template > Edit HTML > Centang Template Expand Widget
• Copy kode dibawah ini dan pastekan tepat diatas 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.star: Ganti dengan username fans page facebook yang anda punya
• Join at facebook: silahkan disesuaikan
• kakinetworkdotcom01time="15" : adalah (second/detik) yang diperlukan sampai popup nya tertutup sendiri
• Skin="01" : Ganti dengan kode skin yang lain (01,02,03,04). Contoh skin nya ada di bawah ini:

SKIN "04"

•  Langkah terakhir , simpan template...!!!

Semoga Artikel ini bermanfaat dan jika ada saran ataupun kekurangan dari tutorial ini, mohon memberkikan komentar di bawah. Terima kasih dah Happy Blogging...!!!