close
English French German Spain Italian Dutch

Russian Portuguese Japanese Korean Arabic Chinese Simplified

Minggu, 17 Februari 2013

Cara Membuat Like Box Facebook Melayang dengan Timer di Blog

23.20    7 comments

VatHFlasz - Cara Membuat Like Box Facebook Melayang dengan Timer di Blog.
Salam Sobat Blogger..
 Setelah sebelumnya membahas Memasang Tombol Pop Up Like Box Facebook dan Follow Twitter Otomatis di Blogspot, Sekarang saya akan bahas lagi cara atau bisa dibilang model kedua dari kreasi menampilkan likebox facebook melayang. Yang keren dari Model sekarang ini adalah bentuknya yang Popup dengan tambahan timer yang akan membuat likebox ini tertutup secara otomatis. Keren bukan ?
Dan untuk pemasangannya pun sangat mudah tinggal copas code script yang sudah disediakan di bawah ini di dalam template blog diantara <body> dan </body> intinya diletakkan sesudah <body> dan sebelum </body>.

Sreenshotnya bisa lihat dibawah ini atau Demo Livenya langsung pada blog VatHFlasZ ini :
 

Sebelum kita mulai memasangnya seperti tutorial sebelumnya jangan lupa sobat sudah membuat fanpage facebooknya okehh. Tujuannya sih cuma buat ngambil Link username Fanpage facebook kita ajj.

Ok langsung kita mulai saja !!!
1. Seperti Biasa login Ke blog sobat masing2
2. Pada Dashboard blog silahkan pilih Template >> Lalu Edit HTML >> Kemudian jangan lupa Centang Expand Template Widget
3. Cari kode tag <body> atau </body>. Untuk mempermudah Klik ctrl+f dan ketikan <body> atau </body>
4. Copy kode di bawah ini dan pastekan di bawah <body> atau diatas </body>
  
Klik show untuk melihat
<!-- Vathflasz.com Likebox Pro FBFan 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: 60px;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="pages/Vathflasz/222598464491763",
 kakinetworkdotcom01title="Join us at Facebook!",
 kakinetworkdotcom01skin="02",
 kakinetworkdotcom01time="25",
 kakinetworkdotcom01wait="0",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script src='http://lostsector-project.googlecode.com/files/likebox-facebook-with-timer.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>
<!-- Vathflasz.com Likebox Pro FBFan Code End -->

Keterangan :
# pages/Vathflasz/222598464491763 >> Ganti dengan Link Fanpage facebook Sobat
# Join us at Facebook! >> Bisa diubah sesuai selera
# time="25" >> Atur waktu Y timer popupnya sesuai selera
# skin="02" >> Skin bisa dirubah2 , tinggal pilih dan pasang (01, 02, 03, 04) Tinggal pilih dibawah 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
5. Jika sudah Simpan Template dan Selesai !!
Nah sederhana bukan...
Yang di atas adalah contoh sederhana tentang  Cara Membuat Like Box Facebook Melayang dengan Timer di Blog , selanjutnya bisa sobat  kembangkan sendiri menurut keinginan sobat.

Demikianlah postingan saya kali ini...
Semoga bermanfaat..  

7 komentar:

^ Hiasilah blog sederhana ini dengan komentar sobat yang membangun
^ Tolong jangan berkomentar SPAM
^ Link aktif di komentar secara otomatis di nonaktifkan.
Terima kasih atas kunjungan dan partisipasinya.
Salam Bahagia.



Flag Counter
AllNewsSite Link Exchange Page Rank Checker Free Auto Backlink Exchange Service
Vietnam Backlinks Free Automatic Backlink Blogger Widgets Personal blogs