Letak Facebook Share Button dalam Blog

Penggunaan button share dalam blog untuk web sosial facebook dapat memudahkan para pengunjung sesebuah blog berkongsi apa yang disukai kepada kawan-kawan di facebook.
Letak Facebook Share Button pada Blog

Dengan hanya beberapa klik sahaja, ianya sudah siap sedia untuk dikongsi di profile facebook. selain itu penggunaan facebook share button ini dapat manarik lebih ramai pelawat ke sesebuah blog.

Contoh penggunaan facebook share button (selain blog ini) adalah di unwanted86 dan juga ohbest.

Cara untuk memasukkan facebook share button ini adalah seperti berikut.

1. Pilih jenis facebook share button yang anda kehendaki, kemudian copy code yang diberi.


Code untuk Full

<div style="float:right;padding:4px;">
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>



Code untuk Compact

<div style="float:right;padding:4px;">
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>


2. Login akaun blogger, dari dashboard > design > edit HTML > Expand Widget Templates (Jangan lupa backup template)

3. Menggunakan fungsi find (ctrl + F), cari kod ini.

<div class='post-header-line-1'/>



jika tidak jumpa, cari kod ini.

<div class='post-header-line-1'>





4. Selepas itu paste kod share button (langkah 1) DIBAWAH kod yang anda cari (langkah 3)

5. Save template dan lihat hasilnya.

131 comments:

  1. hye~
    Leya tak berjaya nak buat la share button ni

    ReplyDelete
  2. thx. suka sbb simple n senang nk ikot.

    ReplyDelete
  3. macamana nk letak like button plak??? please reply..huhu

    ReplyDelete
  4. thanks...akhirnyer berjaya jugak aida letak share button ni..

    ReplyDelete
  5. yea!

    alhamdulillah...makin bertambah maju blog saya..
    =)

    ReplyDelete
  6. oyeye!!!berjaya..thanks alot...yahoooooooo

    ReplyDelete
  7. dah lama mencari nie...
    thx bro...byk ilmu dpt

    ReplyDelete
  8. tak jumpa pun kod langkah 3 tu...huhuhu

    ReplyDelete
  9. tak dapat la..

    kuar msg nih

    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: The element type "b:includable" must be terminated by the matching end-tag "".

    napa ek?..huhu

    ReplyDelete
  10. x menjadi lah na buat...huhu...nape ye...

    ReplyDelete
  11. TQ... UDAH JADI.. MAKIN COMEL BLOG SAYA... THANKS ALOT.. JMPUT LA DTNG SUMER..HEHEHE:)

    ReplyDelete
  12. tak dapat cari langkah ke 3 tu?? mcmana?? tolong plez..

    ReplyDelete
  13. thank you...dah amik beberapa tutor kat blog anda..

    ReplyDelete
  14. berjaya!! thanks alot....


    terbaru dari chempaka: ikan terubuk goreng

    ReplyDelete
  15. I'm done! It's working. Thanks! :)

    ReplyDelete
  16. INGIN TINGKATKAN TRAFFIC BLOG ANDA?
    SERTAI KAMI DI MALAYSIAN BLOGGERS COMMUNITY
    PING BLOG ANDA SECARA PERCUMA DISINI.

    CLICK HERE TO JOIN"MALAYSIAN BLOGGERS COMMUNITY"

    ReplyDelete
  17. OTK (oh tuhan ku)! berjaya sudah. thnxxxxx

    ReplyDelete
  18. ermm blog sy tade kod step ke-3 tade lam html..........................cmne nk watttt

    ReplyDelete
  19. Tq sekali lagi.. dah berjaya jugak. :)

    ReplyDelete
  20. ok dah selesai....banyaknya benda belajar hari ini....TQQQ!!

    ReplyDelete
  21. time kasih banyak-banyak atas ilmu yang dishare

    ReplyDelete
  22. Ada sesiapa kat sini yang boleh bantu..

    dua dua code ni takde

    camana nak buat..?

    Untuk pengetahuan anda, blog saya guna template XML

    http://myblogshowcase.blogspot.com/

    ReplyDelete
  23. same ngn masalah Permata Noven

    ReplyDelete
  24. thx! dah buat dn dh brjaye.. :)

    ReplyDelete
  25. korunk...tlg la...aq x reti nk uat la...

    ReplyDelete
  26. kenapa ye dia ckp more than one id..da byk kali gtry da

    ReplyDelete
  27. bole bantu saya tak..da try byk kali xbole..dia cakap id HTML28 more than 1..npe ye

    ReplyDelete
  28. bleh pn ltak... thnx 4 da tutor. :)

    ReplyDelete
  29. nape xde kowt tuh???susah2..tolong!!!

    ReplyDelete
  30. Pesal aku tak jupe-2 kod tu... camna erk.. ada sapa-2 bleh tolong tak..?

    ReplyDelete
  31. saya tak tau nak buat....camner???sila hantar email kat saya...airil8281@yahoo.com

    ReplyDelete
  32. ta jadi larhhh. . . .

    ReplyDelete
  33. blog sye trus kena sekat..tak bole bkk sbb error.. camane ni..?

    ReplyDelete
  34. Thanks For Info www.zoomartis.net

    ReplyDelete
  35. ane udh masukkin tuh kode smua. tpi kok gak muncul ya?????

    ReplyDelete
  36. cemane nak cari kod yg (ctrl + F) tu???

    ReplyDelete
  37. aik ? cm same jerp kod step 3 ngn 4 tu .

    ReplyDelete
  38. JAWAB LAA KAWAN2...... X JUMPA KOD ..CAMNA??????

    ReplyDelete
  39. kena cuba byk kali, baru jadi.

    TQ ya

    ReplyDelete
  40. berguna lagi tutor nih..thanks a lot ;)

    ReplyDelete
  41. Done.tp,camna nak tau orang yg shared tu yerk?

    ReplyDelete
  42. semua tutorial kt sini kebanyakkan tak jd pada blog saya..adak kerana template saya tak terima?

    ReplyDelete
  43. encik tuan rumah,
    ape beza like ngn share??
    kalu kita like, link blog kita akan masuk dlm wallpost gak kn??
    hurm..
    btw,
    nak tnye sket kt en einstein kita neh,
    cmne kita nak trace, sape yg like post kita??
    *agak menagrut soklan tuh kn??

    ReplyDelete
  44. TQ NAK TGK YG KUTOOO PY DAH JD SILA2 KAN LAH

    ReplyDelete
  45. x jd lh...camne nk buat 'post header line' tu ek? please3~

    ReplyDelete
  46. xreti gune ctrl+F . tepakse belek satu satu.mcam nk juling cari.akhirnye jumpe gak dan menjadi.trimassss !

    ReplyDelete
  47. Terima kasih banyak2. Hari ni cuti so banyak perubahan dalam blog saya apabila mengikuti tutorial2 yang disedikan.....

    ReplyDelete
  48. kenapa step 3 tu sama jeh dy punya carian? saya tak jumpa la kod tu :(

    eh, fhm ke ape yg saya ckp? haha ayat cm ape jeh.

    ReplyDelete
  49. ctrl + F, tgok kat keyboard...then tekan dua2 tu kekunci....

    thanks admin!
    contain2 kat sini sangat berguna ..:)

    ReplyDelete
  50. terima kasih bnyak2..
    puas sy cri rupanya kt blog ni ada html nya siap panduan paste lg

    ReplyDelete
  51. yang tak jumpe step 3 tu, masa nak edit html tu tak tick pada expand widget template kot..

    ReplyDelete
  52. thanz..da berjaya bt..senang je kn..ingat susah..hehe..:)

    ReplyDelete
  53. slm kwn2,bg yg xbole gunakan cara di atas,bole try tgk kt link ini pule ye :)
    http://www.jamaluddin.net/2011/05/cara-letak-button-share-facebook-fb-di.html

    ReplyDelete
  54. alhamdulillah menjadi..thnx:))

    ReplyDelete
  55. Good Tips...saye suke n berjaya melakukannye...want to try another one

    ReplyDelete
  56. sy berjaya letak script tu, tetapi hanya gambar share tu yg kuar, link tiada kangsung ke facebook (tidak aktif) kenapa ye, ada sesiapa yg dpt bantu

    ReplyDelete
  57. akhirnya...
    dah 3 blog saya cari dapat jugak buat
    thank a lot!

    ReplyDelete
  58. nak tanya nih apsal fb share nmpak separuh sahaja hmhhmhm dah berkali pun masih x nmpak full ,, kawan tolong tgk kan kenapa jadi mcm tuh

    ReplyDelete
  59. fuhhh....brjaya jg aku...hehehe...

    ReplyDelete
  60. ok..berjaya letak,tapi kt post sy hilang terus apa yg saya post...when click kt tajuk entri, apapun xkuar... :(

    ReplyDelete
  61. tak reti...sebab cari kod tak jumpa..sesiapa tolong xplain kan...

    ReplyDelete
  62. dah puas cuba...dah mcm2 kod dah...
    tetap x berja...rasanya templet saya ada masalah...

    ReplyDelete
  63. TAK JADI PON...KENAPE EK? NAK GAK LETAK SHARE BUTTON KAT BLOG...ANYONE CAN HELP?
    FEEL FREE TO VISIT MY BLOG..T KAMI FOLLOW BLOG AWAK...http://haniinara.blogspot.com

    ReplyDelete
  64. sy pon dah cuba lame tp xjd...xtaw mslh ape...mungkin gk ade kaitan ngn template...haihh

    ReplyDelete
  65. Memang membantu....banyak ilmu diberi, banyak ganjaran allah beri seperti juga sedekah....

    ReplyDelete
  66. Wow keren Caranya kaka :D
    thanks atas infonya ..
    Kumjumgi yah Blog saya :D jangan lupa jadi member http://ilmukomputertkj3.blogspot.com/ Terima kasih

    ReplyDelete
  67. tak dapat jumpa lah kod kedua-dua tu.. mcm ner eh?

    ReplyDelete
  68. xdpt buat...
    http://jomsihatdanceria.blogspot.com

    ReplyDelete
  69. TQ SO MUCH! dah byk kali try, tp ikut tutrial kat sini je baru menjadi. sgt hepi :)
    salam perkenalan, my blog http://suplemenuntuksemua.blogspot.com/

    ReplyDelete
  70. ermm .. x dpt lha :( x jmpe kod yg kat step 3 tu

    ReplyDelete
  71. my blog
    4infomasi.blogspot.com

    ReplyDelete
  72. jadi , thank you sangat ya !

    http://blurrr4evablurr.blogspot.com/2014/11/buat-duit-di-ilanceecom.html

    ReplyDelete
  73. terima kasih... jom tengok blog saya http://popcorneater1.blogspot.com/

    ReplyDelete
  74. salam...saya x dapat cari kod SHARE (cntrl+F) tu dalam template blog saye....kenape ye admin ??

    ReplyDelete
  75. replica bags aaa quality this link j7n51u5t13 replica bags aaa quality replica bags online uae my response m4e62z4r88 replica bags nyc check out here f0j39j0w94 replica louis vuitton replica bags louis vuitton

    ReplyDelete