Berikut adalah cara untuk menambahkan Tombol Like FB di Postingan Blog secara Otomatis
Ikuti Langkah-langkahnya:
Pendahukuan:
Ada beberapa jenis
Facebook like button. Berikut preview plus script-scriptnya yang dibuat untuk Blogger/Blogspot:
Standard Facebook Like Button
<!-- Tombol Facebook Like -->
<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true'
expr:src='"http://www.facebook.com/plugins/like.php?href="
+ data:post.url +
"&send=false&layout=standard&show_faces=false&width=450&action=like&font=arial&colorscheme=light&height=35"'
frameborder='0' scrolling='no' style='border:none; overflow:hidden;
width:450px; height:35px;'/>
</b:if>
Box Count Facebook Like Button
<!-- Tombol Facebook Like -->
<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true'
expr:src='"http://www.facebook.com/plugins/like.php?href="
+ data:post.url +
"&send=false&layout=box_count&show_faces=false&width=55&action=like&font=arial&colorscheme=light&height=65"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:65px;'/>
</b:if>
Button Count Facebook Like Button
<!-- Tombol Facebook Like -->
<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true'
expr:src='"http://www.facebook.com/plugins/like.php?href="
+ data:post.url +
"&send=false&layout=button_count&show_faces=false&width=90&action=like&font=arial&colorscheme=light&height=21"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/>
</b:if>
a.
Secara default, Tombol Facebook like akan muncul disisi kiri. Oleh
karena itu, jika ingin menampilkannya di sisi kanan (seperti yang di
blog ini), kita dapat menambahkan CSS styling, float ke kanan, dan untuk memberi batas dengan posting ditambahkan padding plus value-nya lalu memasukkan styling tersebut di dalam tag div.
<div style='padding:4px; float: right;'>
</div>
Cara menyisipkannya:
<!-- Tombol Facebook Like -->
<b:if cond='data:blog.pageType == "item"'>
<div style='padding:4px; float: right;'>
<iframe allowTransparency='true'
expr:src='"http://www.facebook.com/plugins/like.php?href="
+ data:post.url +
"&send=false&layout=button_count&show_faces=false&width=90&action=like&font=arial&colorscheme=light&height=21"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/>
</div>
</b:if>
b. Jika ingin mengubah tampilan Facebook like menjadi gelap (dark), ubah value pada colorscheme=light, ganti light dengan dark colorscheme=dark.
Cara memasang Facebook Like di Blogger:
1. Masuk ke dashboard > Design/Rancangan > Edit HTML.
2. Klik/check "Expand Widget Templates"
3. Pilih salah satu script/kode dari jenis Facebook Like di atas, lalu:
4. Jika ingin memasang button di atas posting, cari <div class='post-header-line-1'/> atau <div class='post-body'> (gunakan Ctrl+F) dan paste kode tersebut tepat di BAWAH-nya. Jika kedua kode tersebut tidak ketemu, letakkan kode di ATAS <data:post.body/>.
5. Jika ingin memasang button di bawah posting, cari <data:post.body/> (gunakan Ctrl+F) dan paste kode tersebut tepat di BAWAH-nya.
6. Save template.
Hasil.
PERHATIAN!
