Pada
kesempatan kali ini saya akan memberikan tutorial tentang cara memasang
atau membuat fanspage Facebook melayang di blog. Widget yang akan saya
bagikan ini sudah diberi efek melayang, jadi Anda tidak perlu khawatir
widget ini nantinya akan memakan space yang besar di blog anda.
1. Login ke akun blog Anda
2. Pilih Tata Letak
3. Kemudian Klik Tambahkan Gadget => Pilih HTML/javascript.
4. Copy Kode di bawah ini dan pastekan di HTML/javascript tadi. kemudian simpan/save !!!
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute;
bottom:-1000px;
left:50%;
margin:0px 0px 130px -182px;
width:auto;
height:auto;
padding:16px;
box-shadow: 0px 0px 7px #222;
background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px
}
}
#kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
border-radius:10px;
cursor:pointer;
}
</style>
<script src='http://tugasku4u.googlecode.com/files/tombol-close-menu.js'/></script>
<div id='kotak-facebook'>
<font size="3"><b>Bantu Like Dong Sobat... ^_^</b></font size>
<br/>
<div class="fb-like-box" data-href="http://www.facebook.com/tugasku4u"
data-width="292" data-height="250" data-show-faces="true"
data-stream="false" data-header="false"></div><a
class='close' href='#'>×</a></div>
#FFFFFF = ganti dengan warna background yang Anda sukai
Bantu Like Dong Sobat... ^_^ = ganti dengan kata-kata yang Anda sukai
http://www.facebook.com/tugasku4u = ganti dengan URL Fanspage sobat.
5. Simpan, kemudian pilih Template => Edit Template
6. Cari kode <body>, Untuk mempermudah mencari silahkan tekan ctrl+F pada keyboard dan silahkan tulis kode di atas.
6. Cari kode <body>, Untuk mempermudah mencari silahkan tekan ctrl+F pada keyboard dan silahkan tulis kode di atas.
7. Setelah dapat, copy dan letakkan kode di bawah ini tepat di bawah kode <body>. Anda bisa melihat contohnya pada gambar di bawah...
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Selamat Mencoba !!
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Selamat Mencoba !!
Mau lihat artikel lain (klik disini)?
EmoticonEmoticon