 |
Cara Membuat Widget Like Facebook Dengan Pop Up JQuery |
Seperti yang kita tahu
Facebook merupakan salah satu
jejaring sosial yang sangat digemari para penikmat dunia internet.
Facebook juga sangat familiar dengan para blogger/webmaster dengan menyediakan berbagai macam
Widget yang bisa diintregasikan langsung dalam
Blog/Website.
Nah salah satunya adalah
Widget Like Facebook dengan Pop Up JQuery yang sangat mengagumkan berikut ini, tampilannya sangat bagus dan terlihat sangat profesional. Padahal cukup sederhana
Cara Membuat Widget Like Facebook Dengan Pop Up JQuery ini.
Oke langsung saja saya kasih tahu bagaimana
Cara Membuat Widget Like Facebook Dengan Pop Up JQuery di Blogger, berikut ini langkahnya:
Langkah 1 : Login ke Blogger >> Dashboard >> Tata Letak
Langkah 2 : Pilih Add Gadget >> HTML Javascript
Langkah 3 : Kemudian masukkan kode di bawah ini ke kotak yang muncul :
<!-- sajakrerindu.blogspot.com Likebox Pro FBFan Code Start -->
<style>#fblikepop{background-widcolor:#fff;display:none;position:fixed;top:200px;_position:absolute; /* hack for IE 6*/width:400px;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:150%;}.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:150%;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:70px;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><script>google.load("jquery", "1");</script>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script type="text/javascript">
//<![CDATA[
sajakrerindu01username="KataMutiaraDanMotivasi",
sajakrerindu01title="Sambil Nunggu Loading Like Yuk ^^",
sajakrerindu01skin="02",
sajakrerindu01time="10",
sajakrerindu01wait="0",
sajakrerindu01lang="id"
//]]>
</script>
<script type="text/javascript" src="http://sajakrerindu.xtgem.com/js/likefb.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){$().sajakrerindu({ closeable: true });});
//]]>
</script>
<!-- sajakrerindu.blogspot.Com Likebox Pro FBFan Code End -->
Sebelumnya edit dulu
Kode Widget Like Facebook Dengan Pop Up JQuery yang berwarna merah diatas, keterangannya sebagai berikut:
sajakrerindu01username="isi dengan username fans page sobat",
sajakrerindu01title="isi dengan judul/tulisan pada menu widget",
sajakrerindu01time="isi dengan waktu menutup widget otomatis(detik)",
$(document).ready(function(){$().sajakrerindu({ closeable: true });}); (jika true berarti ada tombol close, jika false tidak ada tombol close)
Catatan: Jangan ubah kode lain selain yang berwarna merah meskipun hanya tanda koma(,) maupun petik(") karena
Widget Like Facebook Dengan Pop Up JQuery ini tidak akan bisa tampil alias Error. Karena saya membuat
Widget Like Facebook Dengan Pop Up JQuery ini dengan javascript yang valid.
Untuk melihat Demo
Widget Like Facebook Dengan Pop Up JQuery pada Blog silakan
klik disini.
Oke sekian dulu
Tutorial Cara Membuat Widget Like Facebook Dengan Pop Up JQuery dari saya, jika ada kendala silakan tulis di kolom komentar, semoga bermanfaat ^^