Cara Membuat Kotak Like Facebook Menarik Di Blog
Sebelumnya saya sudah posting tentang Cara Membuat Fan Page Facebook. Pada postingan disana, saya hanya memberikan cara membuatnya saja, untuk memasangnya di blog, baca postingan ini
Ketika kita blogging, banyak sekali hal hal yang bisa kita lakukan untuk mempercantik tampilan blog. Sekarang saya akan memberikan informasi tentang facebook atau lebih tepatnya cara membuat kotak like facebook menarik yang melayang di blog.
Ketika kita blogging, banyak sekali hal hal yang bisa kita lakukan untuk mempercantik tampilan blog. Sekarang saya akan memberikan informasi tentang facebook atau lebih tepatnya cara membuat kotak like facebook menarik yang melayang di blog.
Jika ingin tahu contohnya seperti apa, lihat like box facebook milik blog ini seperti gambar dibawah
Cara Membuat Kotak Like Facebook Menarik Di Blog
Pertama, Login ke akun blogger Anda, pada dashboard klik Tata Letak
Kedua, Klik tambah gadget
Ketiga, Cari, lalu pilih widget yang bernama HTML/Javascript
Keempat, copy kode dibawah ini lalu editlah sendiri
<!-- FB melayang tombol close awal --!>Keterangan :
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:10%;
margin:0px 0px 0px -182px;
width:auto;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#E3E3E3; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
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;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script src='http://raxterblog.googlecode.com/files/tombolclosemenu.js'/></script>
<div id='kotak-facebook'>
<font size="3"><b>Bantu saya untuk klik like ya...</b></font size>
<br/>
<!-- Mulai --!>
<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>
<div class="fb-like-box" data-href="http://www.facebook.com/jonarendra" data-width="292" data-height="400" data-show-faces="true" data-stream="false" data-border-color="green" data-header="true"></div>
<!-- Selesai deh bro--!>
<a class='close' href='#'>×</a></div>
<!-- FB melayang tombol close akhir --!>
- Kalimat yang berwarna biru bisa anda ganti dengan kalimat yang muncul diatas kotak like facebook nantinya
- Angka 3 merupakan ukuran font dari tulisan "Bantu saya klik like ya..." juga bisa anda ganti sesuai keinginan anda
- Rangkaian kode HTML yang berwarna merah ini harus anda ganti dengan kode like facebook anda sendiri
Jika anda belum mengetahui kode HTML like facebook anda, bisa dicari pada postingan saya
Terakhir, Klik Save/Simpan
Posted by , Published at 17.31 and have
