Ads: (Please Click!)

Tuesday, August 31, 2010

Facebook Like / Recommend Button


Artikel tutorial ini telah dikemaskini. Sila KLIK SINI untuk tutorial yang lebih up-to-date.


Salam semua.

Di sini ada sedikit pengemaskinian tutorial tentang bagaimana mahu letak butang Facebook Like (Facebook Like / Recommend Button) pada setiap artikel (entry) yang anda terbitkan (post) di dalam blog anda.

Sebelum ini, saya pernah terbitkan satu artikel tutorial yang berkaitan dengan Facebook, iaitu Facebook Share di mana tutorial ini mengajar anda bagaimana suatu artikel anda itu dikongsi di Facebook. Kali ini aku akan nyatakan bagaimana mahu buat 'Like' pula, sekiranya pembaca-pembaca blog anda menyukai atau meminati suatu artikel di blog anda. Terlebih dahulu, aku ingin menyatakan bahawa butang ini bukan sahaja didatangi dengan 'Like' malah ia boleh berbentuk 'Recommend' juga.

Di sini saya nyatakan secara mudah bagaimana mahu aplikasikan butang Facebook Like / Recommend ini di dalam blog anda.

Klik spoiler ini untuk meneruskan bacaan..

Caranya:

1) Masuk (login) blogger anda. Klik pada Layout (sekarang ditukar kepada Design) dan klik Edit HTML.
2) Kemudian, tandakan (check) pada kotak Expand Widget Templates.
3) Seterusnya, buat carian pada editor HTML anda dengan katakunci '<data:post.body/>'. Jika anda menggunakan Firefox, anda hanya perlu menekan keyboard Ctrl+F.
4) Kemudian, copy kod di bawah:

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=true&amp;width=100&amp;action=like&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:80px;'/>

5) Kemudian, paste kod di atas pada baris bawah '<data:post.body/> tadi.
6) Save kod anda.

Opsyen Tambahan.

Anda juga boleh mengubah code di atas. Seperti yang aku telah nyatakan di atas, butang ini bukan sahaja didatangi dengan 'Like' malah ia boleh berbentuk 'Recommend'. Tetapi bagaimana?


Berdasarkan kod yang telah diberi, anda hanya perlu menukar action=like kepada action=recommend. Butang anda akan berubah seperti imej di atas.

Anda juga boleh meringkaskan paparan jumlah pengguna seperti di atas. Caranya, tukarkan layout=standard kepada layout=button_count.

Selain itu, anda juga boleh mengubah font yang berlainan. Di bawah, aku sediakan jenis font yang boleh digunapakai:

1) font=lucida+grande
2) font=segoe+ui
3) font=tahoma
4) font=trebuchet+ms
5) font=verdana

Anda hanya perlu mengubah kod font=arial kepada salah satu font-font yang dinyatakan seperti di atas.

Jika ada persoalan dan kemusykilan, nyatakan di ruang komen bukannya di ruang chat.

Oh ya. Ada beberapa pembaca pernah bertanyakan masalah kepada aku di mana butang Like mereka tidak memaparkan gambar profile kecil seperti di bawah:

Untuk mengatasi masalah ini, anda hanya perlu memastikan kod show_faces perlulah equal (=) kepada true. Dengan kata lain, anda perlu ubah kod show_faces=false kepada show_faces=true.

Sekian. Selamat mencuba!
Jom cuba: Tukarkan kod colorscheme=light kepada colorscheme=dark. Lihat kelainannya! :)


PERHATIAN! Aktiviti PLAGIAT (copy & paste) sesuatu artikel tanpa pengetahuan dan kebenaran penulis adalah satu aktiviti/perbuatan yang TIDAK BERMORAL!

Ads: (Please Click!)
Comments
20 Comments


20 Orang Kentut Madu:

/Dayah//Nurul/ said... [Reply]

ENTRY PUAN MAZIDAH LAGIHH PLS

Saddan Juhari said... [Reply]

nice info..

aduka said... [Reply]

dayah:
ye yeee.. saborrrr..
=)

aduka said... [Reply]

saddan juhari:
terima kasih..
=)

syahira ariff said... [Reply]

thanx for sharing
aku suka tutorial berbahasa melayu
sbb inggeris payah nak faham

adreYna said... [Reply]

sy nk mntak kbenaran nk publish cr nk wt LIKE nih kt blog sy...bleh??
nnt sy link kan ke blog awk..

aduka said... [Reply]

syahira ariff:
bahasa ibunda adalah penting..
*ayahanda xde ek..*
=P

aduka said... [Reply]

adreyna:
jika dah ada linknya, maka boleh.. silakan..
=)

Abu Ubaidah said... [Reply]

dah buat, dah jadi :)
tq for sharing

ajjah said... [Reply]

Aduka, thanks for sharing.. dah berjaya buat kat blog saya.. :)

http://walkmethere.blogspot.com

cik ateen said... [Reply]

hehehe..
sowy bru pasan..thank aduka.. :))

☺[ai][sUmi]☺Chan said... [Reply]

dah letak dahh :P

rasasayang79 said... [Reply]

slm. sy dh paste code tu tapi tak berfungsi. blh tunjuk ajar x. www.azhar.cz.cc harap dapat bantu. email sy pada link siapa azhar? tq :)

Aduka said... [Reply]

@rasasayang79

cuba buang kod, dan ganti kod yang baru.. cuba link ini http://developers.facebook.com/docs/reference/plugins/like

rasasayang79 said... [Reply]

ok nak tanya lagi

lepas masuk web tu,

1. URL nak letak apa? url blog?

2. nak pilih kod mana? JavaScript SDK atau XFBML?

tq

Aduka said... [Reply]

@rasasayang79

maaf..
sy silap..
sy rasa lebih sesuai ikut tutorial di atas sbb terdapat error pada href(link) jika guna pd link yg sy bagi..
jika tidak dpt ikuti tutorial di atas, sila periksa balik kod yg anda copy kemudian paste pada lokasi yg betul.. kesilapan copy dan edit membuatkan kod itu error..

rasasayang79 said... [Reply]

sy still x dpt buka like button tu. dia tak bawak ke laman fb. hanya tanda visit sahaja. semua code saya dah try termasuk code tuan. still same.

boleh email private? alamat email kat "siapa azhar?" terima kasih

Aduka said... [Reply]

@rasasayang79

sy sudah lihat di blog anda.. dan like button sudah terpapar di atas widget linkwithin..

rasasayang79 said... [Reply]

yes. saya tau butang itu ada. tapi apakah ia berfungsi. rakan saya mengatakan tidak. saya pun cuba juga. butang share dan like tidak berfungsi. tolong confirmkan.

saya nak paste code dari template kat sini (sebahagian) tapi tak boleh pulak :)

Aduka said... [Reply]

@rasasayang79

ok.. sebenarnya ada beberapa cara lagi untuk membuat like button dengan lebih berkesan.. sesetengah blogger dapat mengikuti tutorial di atas dan alhamdulillah ia berfungsi.. dan ada sesetengah lagi mengalami kegagalan seperti saudara..
beginilah..
sy akan update tutorial like button pada malam ini juga.. cuma sy harap kesabaran dari pihak saudara..

untuk makluman saudara, selepas tutorial sy ini diterbitkan facebook telah update aplikasi like button-nya.. maka terdapat beberapa error dikenalpasti terutamanya kepada blogger yg baru berjinak mengaplikasi like button ini..
tak usah risau.. aplikasi ini telah dpt sy atasi beberapa minggu selepas facebook update..

nantikan tutorial like button terbaru dan lebih efisyen dari sy mlm ini! terima kasih sebab komen dan menyedarkan sy akan kesilapan tutorial ini..

=)

Post a Comment

Ruang komen telah di-set sebagai 'dofollow'. Sila tinggalkan URL blog anda dengan cara yang bijak. Baca DI SINI untuk mempelajari SEO mengenai 'dofollow' link.

Kepada ANONYMOUS, sila tinggalkan link dengan cara yang bermoral sedikit.

Terima kasih kerana sudi membaca artikel ini dan menurunkan komen anda.

 

Blog Aduka Copyright © 2011 -- Template created by O Pregador -- Powered by Blogger