Kali ini saya mau share mengenai "Cara Pasang icon "Like this" Facebook di Blog Kamu". Kalau kamu maniak FB (facebook) pastinya sudah tidak asing lagi dengan yang namanya icon "
" ini, Jika selama ini kita hanya melihat ataupun memanfaatkannya di Jejaring sosial tersebut saja kali ini kita akan menerapkannya pada Blog kita.
Copy kode dibawah ini :
Opsi(pilihan) Penempatan
Penempatan dibawah Judul Postingan
" ini, Jika selama ini kita hanya melihat ataupun memanfaatkannya di Jejaring sosial tersebut saja kali ini kita akan menerapkannya pada Blog kita.Copy kode dibawah ini :
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;"><b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:570px; height:25px;'/>
</b:if></div><br/>
<div class='clear'/>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:570px; height:25px;'/>
</b:if></div><br/>
<div class='clear'/>
Opsi(pilihan) Penempatan
Penempatan dibawah Judul Postingan
- jika pada format penempatannya kita pilih dibawah judul postingan, maka langkah pertama yang harus kamu lakukan adalah:
- klik menu Edit HTML , kemudian beri tanda ceklist pada kolom "expand widget template".
- Cari kode dibawah ini:
<div class='post-header-line-1'/>
- Setiap template tidaklah sama, namun kamu tinggal menyesuaikan dengan kode dari template kamu.
- Selanjutnya pastekan kode diatas yang sudah kamu copy tadi (baca kode.1) tepat dibawah kode diatas, maka hasilnya akan seperti ini :
<div class='post-header-line-1'/>
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;"><b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:570px; height:25px;'/>
</b:if></div><br/>
<div class='clear'/>
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;"><b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:570px; height:25px;'/>
</b:if></div><br/>
<div class='clear'/>
- Selanjutnya tinggal disimpan..
Penempatan dibawah artikel
Jika pada format penempatannya kita pilih dibawah artikel postingan, maka langkah pertama yang harus kamu lakukan adalah:
- Kamu tinggal Cari kode dibawah ini:
<p><data:post.body/></p>
- Jika pada template kamu menggunakan "Readmore " , cari kode diatas yang keduanya dan letakkan tepat dibawahnya.
- Selanjutnya pastekan kode diatas yang sudah kamu copy tadi (baca kode.1) tepat dibawah kode diatas, maka hasilnya akan seperti ini :
<p><data:post.body/></p>
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;"><b:if cond='data:blog.pageType != "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:570px; height:25px;'/>
</b:if></div><br/>
<div class='clear'/>
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;"><b:if cond='data:blog.pageType != "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:570px; height:25px;'/>
</b:if></div><br/>
<div class='clear'/>
- Selanjutnya tinggal disimpan..
nb: Pada kode dibawah ini menjelaskan beberapa format tambahan untuk tampilan dari icon tersebut, kamu bisa merubahnya sesuai dengan keinginan kamu.
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;">
pada kode :
width:570px; = Lebar dari kolomnya, kamu bisa sesuaikan dengan selera kamu.
height:25px; = tinggi dari kolomnya, bisa juga kamu ubah sesuai dengan selera kamu.
Reviews
<div style="background:#fff; float: left; margin: 5px 0px 5px 10px; padding:5px;">
pada kode :
width:570px; = Lebar dari kolomnya, kamu bisa sesuaikan dengan selera kamu.
height:25px; = tinggi dari kolomnya, bisa juga kamu ubah sesuai dengan selera kamu.
Reviews
