Cara Modifikasi Facebook Like Box Pada Blog

Cara Modifikasi Facebook Like Box Pada Blog – ini seperti tutorial sebelumnya pada cara modifikasi widget Google+ follower yakni untuk memberi efek background pada widget yang sedikit lebih menarik untuk dilihat dan ditampilkan kedalam blog agar tampil lebih keren pastinya. Hanya saja pada modifikasi facebook like box ini sedikit merubah kode pada class CSS sehingga agar nisa tampil lebih serasi. Untuk langkah penerapannya kedalam blog pun sangat mudah seperti layaknya memasang widget pada umumnya. Tentu sudah paham fungsi dari facebook like box pada blog ini, karena apabila semakin banyak yang subcribe tentu juga akan mendatangkan lalu lintas kedalam blog dan setiap artikel yang kita publikasikan didalam facebook juga akan lebih mudah banyak mengundang pengunjung. Apabila widget pada blog tertata dengan rapi dan dilihat juga enak tentunya pengunjung juga lebih mudah untuk subcribe bukan! Apabila ingin memasang widget facebook like box agar terlihat lebih keren, maka berikut adalah tutorial Cara Modifikasi Facebook Like Box Pada Blog dengan langkah yang simple.

1. Login ke akun blogger.
2. Copy kode berikut ini.

<style>
.likefaceblogevolutions {
width: 280px;
height: 150px;
border-radius: 3px;
position: relative;
background: #E9FBE9;
padding: 0px 10px 15px 0;
}
.likefaceblogevolutions,.likefaceblogevolutions:before,.likefaceblogevolutions:after {
background: #E9FBE9;
border: 1px solid #52E052;
}
.likefaceblogevolutions:before,.likefaceblogevolutions:after {
position: absolute;
content: "";
bottom: -3px;
left: 2px;
right: 2px;
height: 1px;
border-top: none;
}
.likefaceblogevolutions:after {
left: 4px;
right: 4px;
bottom: -5px;
box-shadow: 0 0 2px #52E052;
}
</style>
<div class="likefaceblogevolutions">
<div style="height:150px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fandestyle&amp;width=292&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>

DEMO

Keterangan:
Untuk tinggi lebar dan warna background silahkan anda sesuaikan sendiri dengan yang di inginkan.
Ubah andestyle dan ganti dengan ID facebook atau fanspage anda.

3. Selanjtunya tinggal memasang kedalam widget blog dan langkahnya seperti biasa, klik Tata Letak > Tambah Widget > HTML/Javascript lalu paste kode tersebut kemudian klik Simpan.