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.
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: "Lucida
Sans Unicode", "Lucida Grande", 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("jquery",
"1");</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:
- 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...!!!