Menambahkan Tombol CANCEL pada Komentar

Menambahkan tombol "Cancel" pada komentar - Tombol "Cancel Reply" atau "Batalkan Komentar" berfungsi untuk menutup kotak kometar ketika tidak jadi membalas komentar, setelah kita mengklik tombol "Reply" atau "Balas". Tutorial ini saya dapatkan setelah nyasar ke blog Vietnam yaitu http://blog.duypham.info

Sebenarnya hal ini tidak terlalu essensial, akan tetapi akan sangat berguna ketika kita akan membuat komentar baru dan tidak membalas komentar yang ada. Tombol "Cancel" ini akan muncul di kiri atas pada kolom komentar. Untuk lebih jelasnya silahkan lihat screenshoot di bawah ini :
cancel reply
cancel reply

Langkah-langkahnya :

1. Login ke Blogger
2. Klik Template -> Edit HTML dan centang Expand Template Widget
3. Cari kode (replybox && (commentId !== replyParent)) { dan tambahkan kode ini setelahnya

cancelRep=document.getElementById('bc_0_'+items.length+'I');
document.getElementById(domId).insertBefore(cancelRep,null);
cancelRep.innerHTML=cancelRep.innerHTML.replace(msgs.addComment,'Cancel reply');
if((commentId!=replyParent)&&(replybox.src.indexOf('&parentID=')==-1)){cancelRep.style.display='inline-block'}

4. Simpan Template.

Apabila ingin memodifikasi tampilan tombol, sobat bisa tambahkan kode ini di atas ]]></b:skin>

.comments .continue{display:none;border-top:0}
.comments .continue a{border:1px solid #fa0320;border-radius:3px;box-shadow:0 1px rgba(255,255,255,.3) inset;background:#e8233a;padding:5px 10px;font-size:13px;color:#fff!important;text-decoration:none!important}
.comments .continue a:hover{background:#d70d25}

Maka tampilannya akan berubah seperti gambar ini :

cancel reply

Untuk merubah tulisan "Cancel reply", misalkan dengan "Batalkan Komentar", ganti tulisan "Cancel reply" pada kode di atas.

Semoga bermanfaat....
Berita Lebih Baru Berita Lebih Lama
  • Unknown
    Profil: https://www.blogger.com/profile/02285454683205538559
    30 Maret, 2013

    Ternyata bsa dibuat tombol cancelnya jg ya, kang?
    Ijin nyoba dulu, kang...makasih infonya. :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      30 Maret, 2013

      Monggo silahkan masbro :)

  • Kang Muroi
    Profil: https://www.blogger.com/profile/15022422809113377143
    30 Maret, 2013

    wah ini mantep kang, kadang memnag kita sering salah berkomentar, dan jalan pintasnya ya menghapusnya, trimakasih kang, kapan-kapan tak coba

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      30 Maret, 2013

      mangga kang... biasana pami malaweung nya :)

  • Jane Doe
    Profil: https://www.blogger.com/profile/04233884732688447822
    30 Maret, 2013

    Bisa juga ya di kasih cancel koment, keren kang ismet. (y)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      30 Maret, 2013

      saya juga bingung.. kenapa bisa ya? bukan saya yang keren ah.. pembuatnya

  • Unknown
    Profil: https://www.blogger.com/profile/02284011263403920462
    30 Maret, 2013

    Wih baru kali ini dapet tutorial menambah cancel reply komentar! Nice script bro. :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      30 Maret, 2013

      Thaks mas brow... semoga bermanfaat :)

    • Pantun Simanjuntak
      Profil:https://www.blogger.com/profile/02801633550741062757
      15 April, 2013

      iya nih fiturnya simple tapi useful tapi lebih signifikan lagi kalo kang ismet bersedia bikin tutorial Tombol Preview Comment untuk yg tidak pakai captcha. bisa ya gak kang kira2? :)

  • Bams
    Profil: https://www.blogger.com/profile/08546027631156715713
    30 Maret, 2013

    Tombol cancelnya itu sama aja dengan tombol delete y kang :|

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      30 Maret, 2013

      beda.. kalau delete itu menghapus komentar yang telah dipublish, kalau cancel itu itu menutup kolom komentar..

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      pake treaded comment hack sob :)

  • Rohis Facebook
    Profil: https://www.blogger.com/profile/06237995128299522413
    30 Maret, 2013

    hebat emank tuh blog.duypham, sayang bhsnya thailand.., makasih infox pak *smile

    • Febri Koplo
      Profil:http://tecno-yes.blogspot.com
      30 Maret, 2013

      Keren Gan Sipp dah saya Coba terapin di blog saya yaa...??

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      hehhee.. ya gitu deh,buat febri silahkan dicoba

  • ccv
    Profil: https://www.blogger.com/profile/14261968791786011758
    30 Maret, 2013

    Keren Abisss Nie Tuterialnya

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      Makasih sob..

  • Febri Koplo
    Profil: http://tecno-yes.blogspot.com
    30 Maret, 2013

    Keren .....??? Mahal nie artikelnya Hhaa

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      berapa harganya ya?

  • Arif Budiharjo
    Profil: https://www.blogger.com/profile/13066820089249625888
    30 Maret, 2013

    keren...
    mau nyoba ah.. thank's kang

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      silahkan sob...

  • pengusaha muda
    Profil: http://share-info-gue.blogspot.com/
    30 Maret, 2013

    mau nyoba nih mantep bgt kayanya.
    mksh ya atas sharenya

  • Blogger Sukabumi
    Profil: http://sukabumiblogger.blogspot.com/2013/03/inilah-pemenang-panasonic-gobel-awards-2013.html
    31 Maret, 2013

    mantap banget kang, sudah saya pasang di blog

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      oke deh sob.. sukses kan?

  • Safiy Hati
    Profil: http://www.safiyhati.com
    31 Maret, 2013

    Terima kasih atas sharing ilmunya ini Kang Ismet...
    Saya coba dalam blog saya cara tambahkan tombol cancel ini

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      silahkan sob...

  • Surga Kenari
    Profil: https://www.blogger.com/profile/13268143815189957248
    31 Maret, 2013

    tapi knp blog kang ismet ga ada tombol cancel reply nya :(

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      apa harus semua tutorial diterapin di blog sob? menurut saya cukup di test aja, berjalan atau tidak :)

  • Unknown
    Profil: https://www.blogger.com/profile/07679885589194095770
    31 Maret, 2013

    mkasih broww,,, jangn lupa di bantu yaa... >>>>>>>>>>>>>> http://seoting.blogspot.com/2013/03/cara-praktis-mengisi-pulsa.html

  • Master Jin - Belajar dan Berbagi
    Profil: http://mas-jin.blogspot.com/
    31 Maret, 2013

    tombol cancel ini memang sangat berguna mas..

  • Stroke
    Profil: http://goo.gl/W2Lh2
    03 April, 2013

    terima kasih sudah berbagi ilmunya

  • Jantung Koroner
    Profil: http://xamthoneplus.farid.web.id/agen-obat-herbal/jantung-koroner/
    03 April, 2013

    ijin untuk dipraktekkan kang,infonya,,terima kasih

  • Obat Darah Rendah
    Profil: http://obatpenyakit4u.com/obat-darah-rendah/
    03 April, 2013

    info yang bermanfaat sekali nih,,saya coba kang,,ijin untuk dipraktekkan kang

  • Kanker Darah
    Profil: http://ariantiresti.blogspot.com/2013/04/kanker-darah.html
    03 April, 2013

    terima kasih sudah berbagi ilmunya kang,,ijin praktekkan kang

  • obat herbal penyakit anemia
    Profil: http://pengobatanalternatifpenyakit.blogspot.com/2013/03/obat-herbal-penyakit-anemia.html
    03 April, 2013

    terimakasih bnyak untuk informasinya gan..

  • penyakit tumor lambung
    Profil: http://www.obatpendarahanlambung.com/2013/04/penyakit-tumor-lambung.html
    03 April, 2013

    terimakasih bnyak untuk informasinya gan..

  • penyakit miom
    Profil: http://goo.gl/VAjux
    03 April, 2013

    langsung dicoba aj dah gan..makasih bnyak untuk infonya gan..

  • obat tradisional batu ginjal
    Profil: http://obatherbalpenyakit.com/tips/obat-tradisional-batu-ginjal/
    03 April, 2013

    dicoba dlu deh biar ga penasaran..makasih bnyak gan..

  • cara mengobati tumor rahang
    Profil: http://agenobatherbalalternatif.com/pengobatan-penyakit/cara-mengobati-tumor-rahang/
    03 April, 2013

    okehh deh gan..makasih bnyak yaa gan infonya,,sangat membantu sekali..

  • obat tradisional diabetes
    Profil: http://obatherbal4u.com/agen-penyakit/obat-tradisional-diabetes/
    03 April, 2013

    oke bnget nihh gan,,saya udah prnah nyoba,,hasilnya keren..

  • Kang Sawul
    Profil: http://www.pamali.com/
    03 April, 2013

    Mantep.. jadi pengin coba blogspot lagi neh... hehe
    makasih tutor na... mantep

  • ope
    Profil: http://opebaft.blogspot.com
    05 April, 2013

    bisa dicoba ini, makasih om :D

  • Thedragao Blog
    Profil: http://thedragao.blogspot.com/
    05 April, 2013

    wah kapan kapan saya coba gan ^^

  • Ngeramput.com
    Profil: http://www.ngeramput.com
    07 April, 2013

    Baru tahu saya informasi ini kang, tapi kira2 memberatkan loading blog nggk kang ???

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      ngga sob, biasa aja ko..

  • Elesiss
    Profil: http://elesiss.blogspot.com/
    10 April, 2013

    kembali mendapat ilmu tips blogging dari kangismet makasih banyak ya gan

  • Lehmann
    Profil: http://lehmannsblog.com
    12 April, 2013

    Kang Ismet, Keren tuh. Tapi kodenya kan hanya berlaku utk Bogger, ya?. Saya makenya Wordpress, ada gak ya, kode buat Wordpress? Nuhun Kang buat ilmunya.

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      27 April, 2013

      wah kalau WP saya masih buta sob :)

  • Unknown
    Profil: https://www.blogger.com/profile/00578377221399558114
    09 Agustus, 2013

    Mantab gan , boleh nyoba gak tuh ? :D

    www.kevin-432.blogspot.com

  • Unknown
    Profil: https://www.blogger.com/profile/03028304356873120390
    04 Oktober, 2013

    Mantep lagi nih Kang,, sebagai pelengkap komentar
    Izin nyimak, belajar lagi untuk di praktekan terima Kasih Kang

  • Unknown
    Profil: https://www.blogger.com/profile/05630535377351382017
    21 Oktober, 2013

    Keren kang, coba ditambah lagi dengan tombol edit komentar kayak "sunting" di FB kang ...heheh

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      21 Oktober, 2013

      sayangnya blogger blom bisa edit komen :)

  • Unknown
    Profil: https://www.blogger.com/profile/00305225147558275291
    21 Oktober, 2013

    wah saya juga kesasar ke blog sana, dan akhirnya saya menemukan trik blogger hebat yang jarang ditemukan seperti memasang tombol like di komentar, dll

  • Ayanami
    Profil: https://www.blogger.com/profile/09097652451170658730
    18 November, 2013

    permisi kang mau nanya lagi, hehe
    kalau mau buat tombol cancel nya ada di sebelah tulisan preview kayak punya kang ismet ini gimana yah kodenya?

    btw, di tempat saya kok nga mau muncul ya tombol cancel nya? padahal code2 udah dipasang semua...

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      18 November, 2013

      komentarnya pake sistem hack atau default blogger?

    • Ayanami
      Profil:https://www.blogger.com/profile/09097652451170658730
      18 November, 2013

      pake hack kayak punya kang ismet ini, yg ver3, cm saya modifikasi dikit
      klo mau ngecek alamatnya kazesubs,blogspot,com kang...

    • Ayanami
      Profil:https://www.blogger.com/profile/09097652451170658730
      18 November, 2013

      jadi gmn kang? Apa ada kode tambahan kalau pake sistem hack?

    • Admin
      Profil:https://www.blogger.com/profile/17321267572656821749
      21 November, 2013

      sama nih,,, tombol cancelnya juga gak tampil di blog saya.

  • Unknown
    Profil: https://www.blogger.com/profile/09360506976563460631
    29 November, 2013

    ini jga sukses mas bro , terima kasih banyaak :)

  • MAOEL
    Profil: https://www.blogger.com/profile/16397098907370235173
    22 Desember, 2013

    Kang saya mau tanya gimana cara ngebuat kotak komentar kayak akang gini! saya pgn kotak komentarnya kayak akang. mohon bantuannya kang.

Tambahkan Komentar
comment url
Terima kasih telah berkomentar di Blog Kang Ismet.
  • Untuk menyisipkan Gambar, Kode, atau Kutipan silahkan klik Tab Sisipkan di atas.
  • Emoji yang bisa digunakan pada komentar :), :D, :( <3, :love dan :top
  • Untuk melihat Komentar yang telah ditambah sisipan kunjungi DEMO
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Klik tombol Salin Kode! lalu paste ke kolom komentar.


image quote pre code
62 Komentar