Cara Buat Like Box FB Melayang + Tombol Close diblog

Kali ini Diaz akan share aksesoris blog, salah satunya yaitu membuat Like Box FB Melayang + Tombol Close. Ini juga berguna agar sidebar pada blog kita menjadi efisien.Sebenarnya cara ini sangat derhana dan tidak memerlukan keahlian khusu. Cara ini saya sengaja saya kasih judul Cara Buat Like Box FB Melayang + Tombol Close Seperti PandaAnku.com agar nantinya kalian bisa tahu hasilnya seperti apa.

Berikut cara membuatnya:
1. Pertama masuk Blogger =>Dasbor
2 Pilih/Klik Blog yang akan dikasih Like Box/Like button FB Melayang
3. Klik Template => Klik Edit HTML
4. Klik Proceed
5. Cari Kode </body> lalu copas kode berikut dibawahnya:

.notification{width:350px;height:260px;display:block;position:fixed;bottom:100px;left:490px;/*Border Radius*/border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;/*Box Shadow*/-moz-box-shadow:2px 2px 2px #cfcfcf;-webkit-box-shadow:2px 2px 4px #cfcfcf;box-shadow:2px 2px 2px #cfcfcf}

.notification span{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHtN43bxTPpPqimE_hlDDyNW4CBVW13X00hG4yVNnZgf9wJ-J6fma37mSTMufHAvCol4kR2xXTqaXNLJunK6md5XxHqA6rCM47TE6rBK3B1lOtWg4niUyuvLTzmMopfP2u1yfHSmChoRU/) no-repeat right top;cursor:pointer;display:block;width:19px;height:19px;position:absolute;top:-9px;right:-8px}

.notification p{width:400px;font-family:Arial,Helvetica,sans-serif;color:#323232;font-size:14px;line-height:21px;text-align:left;float:right;margin:10px 15px 0 0;*margin-top:15px;/*for lt IE8*/padding:0;/* TEXT SHADOW */ text-shadow:0 0 1px #f9f9f9}

.warning{border-top:1px solid #fefbcd;border-bottom:1px solid #C5D5E6;/*Background Gradients*/background:#C5D5E6;background:-moz-linear-gradient(top,#fff,#C5D5E6);background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#C5D5E6))}

.warning:before{content:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNdBwpZIbXM3TRuJfY9AjjyXVHvfv5TWIMJ906BUdl5if7mc4eD-_Ytm4HXtRMnvDY46HNqnqduaDHuNehtlbRJPoYVgbyMcz5GYVDEtYPD9nsKd_D__mc4kZJMt16fpPwj8LKP1waARw/);float:left;margin:5px 0px 0 5px}

.warning strong{color:#e5ac00;margin-right:15px}

</style>

$(document).ready(function(){$('.notification').hover(function(){$(this).css('cursor','auto');});$('.notification span').click(function(){$(this).parent().fadeOut(800);});});</script>

CODE LIKE BUTTON/BOX FB SOBAT

</center>
</div>

6. Bila sobat belum punya fun Facebook silahkan bikin disini:
http://developers.facebook.com/docs/plugins/
7. Simpan.

Mudah kan...tunggu apa lagi langsung aja dicoba dan lihat hasilnya. Semoga artikel Diaz ini bisa bermanfaat untuk sobat-sobat blogger sekalian.Jika sobat mempunyai pertanyaan,kritik ataupun saran,silahkan tulis di kolom komentar yang berada di bawah postingan.Sampai jumpa di Tutorial Blogspot berikutnya.

Cara Buat Like Box FB Melayang + Tombol Close diblog

0 komentar:

Posting Komentar