Pasang Button Facebook Like di Blog

Aku tengok banyak blog yang dah pasang button ‘Tweet‘ dan ‘Facebook Like‘ kat blog masing-masing. Baru hari ni aku ada masa free sikit untuk tengok-tengok coding, dan hasilnya, blog AnarmNet kini dah dilengkapi dengan Tweet Button.

Pelawat-pelawat blog ni khususnya yang ada akaun Twitter, silalah Tweet mana-mana post yang ada dalam blog ni ye. Tu pon kalau korang suka dengan post-post yang aku tulis. Kalau tak suka, dialu-alukan juga untuk Tweet.

Fungsi Button Facebook Like

Berbalik kepada topik asal yang aku nak ceritakan. Mesti korang tau kan ‘Facebook Like Button‘ ni benda apa? Bagi pengguna Facebook tegar mesti tau benda ni.

Fungsinya di Facebook adalah untuk berkongsi content yang disukai (like) dengan rakan-rakan Facebook yang lain. Button Like di blog ni pulak adalah untuk berkongsi artikel yang disukai di blog dengan rakan-rakan di Facebook. Paham?

Facebook Like Button

Kalau tak paham, sila baca sampai habis ye. Hehe..

Untuk tengok button Facebook Like yang aku dah pasang kat blog ni, sila scroll down sampai ke penghujung entri. Kat situ ada 1 button bertulis ‘Like’ dengan simbol jari ‘thumb up’.

Bila korang klik button Like tu, nama korang beserta gambar profile yang korang gunakan di Facebook akan terpapar kat situ. Then, korang cuba tengok kat profile Facebook korang, kat Recent Activity.

Button Facebook Like ni kebanyakkan blogger yang menggunakan WordPress (Self-Hosted) lebih senang menggunakan plugin seperti Facebook Like Button Plugin ataupun FBLikeButton.

Bagi yang taknak menggunakan plugin, boleh buat secara manual. Senang je.

Cara Pasang Button Facebook Like di WordPress

Copy code di bawah ni kemudian buka fail single.php dan cari the_content(). Paste sama ada sebelum ataupun selepas the_content().

Cara Pasang Button Facebook Like di Blogspot

Bagi pengguna Blogspot, caranya lebih kurang sama jugak (copy paste).

  1. Masuk ke Dashboard > Layout > Edit HTML. Kemudian download template anda dulu sebagai backup takut berlaku apa-apa yang tak diingini.
     
  2. Tick pada butang ‘Expand Widget Templates’ untuk memaparkan code secara keseluruhan.
     
  3. Cari code <data:post.body> menggunakan fungsi carian di browser (Ctrl+F)
     
  4. Paste code untuk button Facebook Like tadi selepas code <data:post.body>

Info Tentang Button Facebook Like

  1. Code Facebook Like ni akan memaparkan gambar profile Facebook orang yang menekan button Like. Sekiranya korang taknak fungsi gambar tu, korang boleh tukarkan “show_faces=true” kepada “show_faces=false“.
     
  2. Perkataan ‘Like’ boleh jugak ditukar kepada perkataan ‘Recommend’. Caranya, “action=like” tukarkan kepada “action=recommend“. Pilih yang mane korang berkenan. Perkataan selain daripada yang tu, korang try and error sendiri la ye.
     

Harap korang berjaya buat seperti yang aku coretkan kat atas tadi. Sebarang masalah yang berlaku time korang nak buat ni boleh bertanya kepada aku.

76 Comments

  1. TQVM atas tutorial yg diberi …boleh la sy pasang kt blog sy …sebagai orang baru …memang seronok dapat belajar banyak perkara pasal blog ni… :angel:

    • @AkuSeti, ya.. memang seronok menimba ilmu dgn blog.. macam2 perkara kita boleh belajar.. yg penting rajin cari ilmu, rajin bertanya, berani mencuba.. kalau gagal takpe.. tu salah 1 proses utk berjaya.. :happy:

      kalau tak berjaya buat mcm dlm tutorial ni, bleh tanye kat sini..

  2. still xleh guna lah…
    kenapa erk..
    wen sy dh buat readmore trus hilang button like nie.. kenapa erk??

  3. mantap-mantap! i suka…dah merebak dah org guna ni….aku baru nk try guna…hahahaha.. :biggrin: :biggrin: :biggrin: :biggrin:
    .-= Post terbaru syinrayafa di blog beliau.. Saya tiada idea untuk update blog, jadi saya buat entri ini. =-.

    • @Mashi, lum ada kesempatan tuk coba ni.. :(
      .-= Post terbaru lowongan kerja di blog beliau.. Assistant IT Support Vacancy Jatim AutoComp Pasuruan =-.

  4. aku coba pake plugin.. tapi memang ingin coba secara manual.
    .-= Post terbaru lowongan kerja di blog beliau.. Game Master (GM) Vacancy Interactive Online =-.

  5. thanks for the info bro! :biggrin:
    .-= Post terbaru najster di blog beliau.. Adobe Photoshop CS5 Extended =-.

  6. style la bro..banyak aku blaja dari blog ko..teruskan usaha untuk membantu orang yang macam aku ni..huhu

  7. Bravo..! lepas ni wat tutorial pasang butang fbshare secara manual utk wp plak =)
    .-= Post terbaru nyetok di blog beliau.. Lif dalam hidup beliau =-.

  8. aku pn dh pasang juga..mcm best..hahaha..dh ada blog tuk local ni kena la psg..ambil advantage…dlu berblog diluar org xpndg facebook..blogger luar xsuka promo guna facebook sbb dorg jga gila profile fb dorg dr diceroboh org xd kenali..

    P/s: ak nk terjah blog ko dgn artikel ak boleh???? :)

  9. untuk aku better pakai plugin je kot
    coding tak reti…takut salah jadi lain pulak kang
    thx untuk link tu
    .-= Post terbaru mokteh di blog beliau.. Finally at Home: Home Sweet Home! =-.

  10. Good tips! Mana aku nak thumb kat tempat ko anarm?
    Two thumbs!
    .-= Post terbaru Rozanighani di blog beliau.. Guna Ping Ninja! Wacha! =-.

  11. elok dipasang button ni. tapi itu lah… orang suke pada tumpuan yang mudah dan besar.
    itu pada pandangan aku. nampak macam butang ReTweet tu besar skit. Kalau
    kita alihkan letak kat tajuk entri, sure orang senang nak like kan tajuk kita. kan anaram?

    anyway… thanks for pingback.. *tetibe jadi plak pingback sekarang ni* :blink:
    .-= Post terbaru Kreuger di blog beliau.. Saya menduduki tangga ke lima untuk kata-kunci Azman I =-.

  12. haha bro..thanks la…bru jumpe..dlam perancangan nak ltak dlm blog aku huh ^.^ :cheerful:
    .-= Post terbaru MC di blog beliau.. Jalan-Jalan Di Facebook: Bhgn 1 =-.

  13. info yang bagus, dah lama dah juga pakai button like ni, cuma skrg ni ada yang update punya kan.. :biggrin:
    .-= Post terbaru Mr.Z di blog beliau.. Membeli Pakaian Berjenama Atau Biasa? =-.

  14. salam wak info yang bagus lepas nielah ayie nak test buat thank q for this info n nice toturial keep in tuch bro anarm :) :cool:

  15. Aku nak gunakan plugin. Malas nak godek2.. hehe
    .-= Post terbaru Syafrizal di blog beliau.. Paramaria Plus: Penyelesaian masalah haid wanita =-.

    • @Syafrizal, terpulang nak pakai plugin ataupun buat cara manual.. asalkan keluar bende yg nak tu cukup le.. hehe.. aku lebih suka wat manual sebab dlm proses nak mengurangkan kuantiti plugin.. rasa mcm dh byk sgt pkai plugin.. org ckp plugin banyak2 bleh memberatkan blog.. risau gak ni..

  16. semalam kakyan ada projek benda nie buat dr plugin tp bila klik like tu dia ada time tu je, bila len kali masuk blog, dia tak keluar pun like berapa..huhu..nnti nk try yg manual nie tgk camne, btw thanks sharing yea :)

    • @yanmie, hahhaa kakyan pnya themes tu takde fail single.php dah tu cuba pulak cari code the_content() mmg takde :shocked:

      nmpknya kenalah guna plugin, tp ada bnyk plugin like nie tak tau mana 1 yg ok…ada cadangan tak :biggrin:
      .-= Post terbaru yanmie di blog beliau.. Ya Rabbi aku dapat lembu free – sila percaya =-.

  17. terbaiklah tutorial ni…ad plugin ok la..bab manual ni aku fail skit…
    .-= Post terbaru azizan4444 di blog beliau.. Blogger + Duit = Politik =-.

  18. best pasang benda ni. nampak cam dh upgrade sikit. (?)

    huhu. :lol:
    .-= Post terbaru .SaYa SeDaP. di blog beliau.. bosan dengan komen blogger. hello wordpress! =-.

  19. wah, menarik sekali. ni yang aku suka ni. nak cubalah, tapi agak susah juga kalau ng thesis aku ni. haha
    .-= Post terbaru mohdisa di blog beliau.. Salam Perpisahan dan Selamat Maju Jaya =-.

    • @mohdisa, kalau rasa susah, pkai je plugin.. pakai plugin rasanye die auto masukkan button tu.. tp aku kurang pasti.. aku tak penah try plugin.. aku buat cara manual je.. hehe

      • aku lebih suka dengan cara manual tak banyak load, aku dah cuba pasang cara manual. tapi takda tempat yang sesuai la plak.
        .-= Post terbaru mohdisa di blog beliau.. Koleksi Entri Bulan April 2010 =-.

  20. Bagus perkongsian menarik..kawe pun nk cuba2 juga ni..
    .-= Post terbaru khai wan di blog beliau.. Cara simple tarik trafik ke blog anda =-.

  21. hahaha..aku pakai plugin jerk..uhuhuhuhu
    .-= Post terbaru apiih di blog beliau.. Movie-Movie Yang Bakal Menggegarkan Pawagam pada 2011 =-.

  22. hoho, aku guna plugin kedua yg ang tulis atas tuh.. best.. satu agi plugin share on fb.. kiri kana ada button kat bawah entri :P semat.. ape2 pon nice tuto :heart:
    .-= Post terbaru syahirul di blog beliau.. Cara mudah menulis komen di blog rakan =-.

    • @syahirul, aku ingat nk pakai plugin gak tadi.. saje cari kot2 ada cara manual sbb aku nak kurangkan guna plugin.. sekali ada la pulak.. terus pasang cara manual.. pakai plugin lagi senang kan? tp aku suke yg payah2.. main2 coding bleh aku belajar bende baru.. huhu

      • @Anarm, aku fail coding :( asas takde.. hahaha
        .-= Post terbaru syahirul di blog beliau.. Cara mudah menulis komen di blog rakan =-.

        • @syahirul, Aku fail pasal coding.. tapi men cuba jaya jerk.. cam theme aku.. tak banyak pakai plugin. :devil:
          .-= Post terbaru Piratz di blog beliau.. Panduan & Infomasi Mengenai Twitter =-.

    • @Dauspozi, pasang je.. ko pakai blogspot kan? code yg aku bg atas tu ntah btol ntah salah, aku pon tak tau.. kalau ade tersalah, tolong pass coding yg btol ek.. tengkiu.. :unsure:

    • @Wan Perlis, kalau ada cara manual, aku lebih suke buat cara manual.. plugin kalau boleh aku nak kurangkan.. takut memberatkan blog.. tp terpulang la nak camne.. pakai plugin dah tentu lebih senang..

        • @zik, camne ek nak ckp.. hmm.. bila pakai plugin, mase tgh loading die macam “call/panggil” fungsi plugin tu utk keluarkan kat blog.. proses nak “call/panggil” tu kadang2 makan masa jugak.. kalau coding kita manual insert ke fail2 php, time loading tu die bleh terus baca dari fail2 utama.. lebih kurang camtu laa.. huhu.. harap bleh paham.. :tongue:

          • @Anarm, ye, better guna cara manual kalau nak loading blog kita laju sket. guna plugin ni kadang-kadang takut tak compatible dgn wp versi baru, timbul masalah pulak
            .-= Post terbaru Amirez di blog beliau.. 50% Discount for Theme Junkie WP Theme =-.

Leave a Reply

Your email address will not be published. Required fields are marked *