Nah, bila anda ingin juga memasang tombol "Like" di artikel blog, berikut ini cara pemasangannya.
Sebenarnya, di situs Facebook sudah tersedia tool untuk mendapatkan kode yang bisa dipasang di website/blog (silahkan lihat di sini). Tapi sayangnya, pada pilihan URL to Like di tool itu, kita hanya bisa menentukan URL statis, tidak bisa membaca secara otomatis URL setiap artikel/halaman blog (URL dinamis). Untuk itu perlu sedikit modifikasi dari kode yang bisa di dapat di Facebook itu.
Silahkan pilih kode yang sesuai dengan platform blog yang dipakai.
*
1. Pasang di template Blogspot/Blogger
Silahkan login, masuk ke Layout, lalu klik Edit Template, centang pilihan Expand Widget Templates. Cari kode
<data:post.body/>
di template anda, lalu di atas/di bawahnya pasang kode ini:<iframe expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&action=like&layout=standard&show_faces=false&width=450&font=arial&colorscheme=light"' allowTransparency='true' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:25px;'/>
*
2. Pasang di template Wordpress.ORG (self hosted)
Silahkan login, masuk ke Appearance, lalu klik Editor (Themes editor). Silahkan buka template Single Post (single.php) atau Page Template (page.php). Carilah kode
<?php the_content(); ?>
, lalu di atas/di bawahnya tambahkan kode ini:<iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink() ?>&action=like&layout=standard&show_faces=true&width=450&font=arial&colorscheme=light" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:450px; height:25px;"></iframe>
*
3. Pasang di Sidebar/Widget/Webpage (javascript)
<script type="text/javascript">
document.write('<iframe src="http://www.facebook.com/plugins/like.php?href=' + escape(location.href) + '&action=like&layout=standard&show_faces=true&width=100%&font=arial&colorscheme=light" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:100%; height:25px;"></iframe>');
</script>
*
Catatan:
- Kita bisa memilih setting tampilan tulisan pada tombol, yaitu "Like" (Suka) atau "Recommend" (Rekomendasikan). Silahkan ganti kode like pada bagian
action=like
menjadiaction=recommend
pada pilihan kode di atas (kode berwarna biru). - Kalau mau silahkan ganti-ganti setting pada kode yang berwarna hijau, utuk pilihannya silahkan lihat di situs Facebook.
*
Berikut ini demo pemasangan pada halaman statis:
*
Kalo suka artikel ini, boleh juga direkomendasikan atau di-"like" :D
Itu tadi adalah pemasangan kode tombol "Like". Kalau untuk tombol Share Facebook silahkan lihat di sini.
*
Update
Sebagai alternatif, silahkan lihat yang ini:
[TUTORIAL] Pasang Tombol Twitter, Facebook Share dan Facebook Like (3-in-1)
*
.
kalo saya lebih milih pake iframe sob, coz lebih valid html :D
ReplyDeletebtw pake lsg pake iframe di sidebar juga bisa kok, kayak blog aku tuh, hehe :D
ya, spt alt 3 di atas itu : :)
ReplyDelete.
Huwaaa.... ini web punya Zon yaaa?... saya dateng dr gugel..hehehe.... lihat ke bawah eh baca tulisan Article by zon... :D saya catat ya, inimu khan? bukan anumu?... :D
ReplyDeletesukses bro :mrgreen:
Oia, trims tutorialnya ya... pake ini bisa tambah kenceng nih traffik dari fb... 8) :lol:
ReplyDeletelangsung ijin pasang bos :) hehe...
ReplyDeletesori ga kasih tau blog ini. ternyata perlu google juga biar mampir ke sini :lol:
ReplyDelete.
silahkan, ga perlu ijin ko :D
ReplyDelete.
hai zon ketemu lagi ^_^,
ReplyDeleteAku koq gak bisa ya bikin "like" ini di web ku?? coba ikutin step2 dari dirimu tetep gak ketemu yg namanya .php???? ada disebelah mana ya??
Sory nih rada gaptek...hehehe
Mohon infonya ya zon.
Tq
Mimi
thanks udah mampir lg ke sini :D
ReplyDeletehehe.. yg php itu buat wordpress.ORG (self-hosted), bukan buat wordpress.COM.
kalo untuk wordpress.com mungkin bisa pake layanan di situs http://getsociallive.com/
.
Nice info nih bro .. :)
ReplyDeleteWalking,
ReplyDeletesalam kenal,
wah,,,,,,,,,mantaps.........mohon bimbingannya..
ReplyDeletegmna cara tukeran link
Terpasang di blogku.
ReplyDeleteMantap dah. :-D
Tapi aku mau tanya, kalau di index.php ga ada ya? Kalau bikin kayak blognya temen ane http://ciebal.web.id gimana nih? :)
Thanks pak infonya,,,,,lumayan gak perlu beli buku tutorial facebook,,mudah mudahan ada tips terbaru lagi yah
ReplyDeletethank infonya... langsung dicoba nih,,
ReplyDeletemakasih infonya, booossss.... :-D
ReplyDeleteinfo menarik, thanks ya sobb..
ReplyDeleteThanks infonya..... bisa langsung dicoba.
ReplyDeleteThnx bro,.. aku emang lagi nyari tutorial ini,.. simple n its working :-)
ReplyDeletethanks bro tutorialnya
ReplyDeletekq wktu ak cari kata , gg ada y ? pdahal dah pke Ctrl + F .
ReplyDeletemhn bantuannya
Wah..berhasiLlll...hore..hore..hore...
ReplyDeletethx ya :)
nice info gan.....iji sedot y...
ReplyDeletetuker link ato banner gan..mw??
Gan, gimana caranya buttonnya jadi bahasa indonesia?
ReplyDeletetnx
Makasih tutorialnya :wink: , sangat2 membantu :-D
ReplyDeletethanks gan infonya ..
ReplyDeletemantabh mas` copas dikit eah... :wink:
ReplyDeleteijin copas kang.... :-D
ReplyDeleteijin lihat kiriman teman
ReplyDeleteWaaaah mantap info nya nih, saya coba edit kodenya sendiri gag bisa.
ReplyDeleteterima kasih. sangat membantu....
salam dari blogger ciamis..
:)
thanks bgt gan, tutorial yg berguna bgt
ReplyDelete:D
saya terdaftar di blog (mesin WP). apakah caranya masih sama?
ReplyDeletewalaupun blog.com ber-engine wordpress tapi ngga mendukung pemasangan javascript, jadi ga bisa pasang script di atas. Alternatifnya pake widget socialize built-in yg disediakan di admin blog.com nya, atau pake tool dari situs http://getsociallive.com/
ReplyDelete.
Mkasih Mas Kebetulan Lagi cari ini :-D
ReplyDeleteminta izin copas skalian eksekusi.
ReplyDeletetrims :wink:
makasih banget :) :wink:
ReplyDeleteMakasih banyak untuk informasi dan sharing widgetnya.......
ReplyDeletealhamdulillah, berhasil mas.. sudah bisa terpasang di setiap artikel. ini blog saya, http://www.mediahati,us
ReplyDeletegan, saya sudah coba. tombol likenya ada, tapi gk bisa di klik. cuman jadi pajangan doang.. :(
ReplyDeletekira2 kenapa yah?
thx before..
Makasi Mas Admin :wink:
ReplyDeleteSama nih.... apanya ya yg salah....???? :roll: :roll:
ReplyDeleteKeren mas tutotial ne..
ReplyDeletekliatan bagus d blog ku.
http://benclunx-boys.blogspot.com/
maksiih mas tutorial yang bagus ne...
ReplyDeletemakasih loh mas tutorialnya....berhasil!!!
ReplyDeletelangsung ksh jempolnya ya mas....heheheh
Makasih bos... udah berfungsi dengan baik tutorialnya...
ReplyDeletethanks, gan... visit mine, please.. :) :wink:
ReplyDeleteterimakasih banyak.. :D
ReplyDeletetrima kasih sobat tutorialnya,,saya sudah coba n bisa..
ReplyDeleteSANGAT MEMBANTU !!!!!!!
ReplyDeleteKlo yg makai Readmore kok cuma di Homepage aja yea :cry: ??
ReplyDeletebisa pas di klik readmore ilang Tombol likenya.. :-?
Tolong di Pencerahannya yaa,... :cry: :cry:
Makasih tutorialnya bang... nice share... dah aku pake di blogku... ^^
ReplyDeletemkasih bang tutorialnya kebetulan lagi nyari neeh
ReplyDeleteTengkyu Mas bro, langsung praktek neeh :)
ReplyDeletemohon bantuan nya masbro , itu iframe statistik yg dibawah kanan buat histat,feedjit ama reader , cara bikin code iframe nya gimana ya masbro ? ...thanks . :-P
ReplyDeleteitu bukan iframe, tapi pake div.
ReplyDelete<div style="height:200px; overflow:auto;">
PAsANG KODE DI SINI
</div>
.
tararengkyu, sudah terpasang di blog ane gan
ReplyDeletegan..mo tanya kalo buat di mywapblog bisa ga??caranya gmana ga.klo bisa bales lwt email.klo sempet datang ke blog ku gan...tnx.
ReplyDeletegood article :wink:
ReplyDeletetitip link gan :lol:
http://andre-sasa.blogspot.com/
Kunjungi ya
teraimakasih inponya gan..
ReplyDeletekeren artikelnya , sangat cocok buat saya yg masih gaptek tentang blog :(
maju terus blognya moga makin sukses n selalu terupdate :)
makasih tutorialnya :)
ReplyDelete