Home » , » membuat tombol reply atau balas komentar

membuat tombol reply atau balas komentar

lagi lagi postingan ini ketinggalan, tapi tak apalah.. karena masih banyak juga yang belum paham, tombol reply atau button reply seringkali kita jumpai dibloger master, memang tombol reply memudahkan sang pemilik blog untuk membalas komentar para pengunjung tanpa susah susah lagi menulis manual nama-nama si pengomentar, dan banyak tutorial yang diberikan oleh para blogger master, semisal dikomentar ada tulisan REPLY TO KOMENTAR atau pun yang berbentuk GAMBAR tinggal kita mau memilih yang mana, karena pada dasarnya tutorial Code yang diberikan relatif sama persis, hanya saja untuk yang berbentuk button image itu menggunakan image/gambar yang telah disimpan dihosting dan diambil Link nya. dan hasilnya dapat sedikit memberatkan loading blog karena harus mendirect linknya, dan yang tak memmerlukan link gambar memang tak mempengaruhi loading blog hanya saja tampilannya tidak inovatif.

nah disini saya mencoba menggabungkan keduanya, bagaimana menghasilkan sebuah button/tombol tanpa harus mendirect link atau pemanggilan sebuah gambar yang hasilnya nanti tidak mempengaruhi loading blog, code yang saya buat ini memang sama sekali tidak mengambil unsur sebuah image, hanya menggabungkan code HTML asli layout blog saya  dan code yang saya dapat dari berselancar, hanya seperti ini saya membutuhkan waktu sampai 2 hari untuk menjadikan tampilan seperti image (cukup lama yah? maklum sayapun masih belajar memahami code HTML), bisa lihat sendiri hasilnya di kolom komentar punya saya ini.

sekarang langsung ke intinya yah..
kalian harus Login ke Blogger > Tata Letak > Edit HTML > Expand Widgets Template, Lalu temukan kode berikutpilih salah satu :
<b:include data='comment' name='commentDeleteIcon'/> atau <data:commentPostedByMsg/> atau <dd class='comment-footer'> atau <p><data:comment.body/></p>

bila sudah ketemu Copy paste Code dibawah ini setelah/dibawah Code diatas
<a expr:href='&quot;https://www.blogger.com/comment.g?blogID=LETAKAN ID BLOG ANNDA DISINI&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=450,height=450&quot;); return false;' style='background-color:#eeeeee;border:1px solid #d3d3d3;color:#000000;text-decoration:none;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;padding:3px 10px;position:absolute;bottom:10px;left:12px;'>Balas</a></span>

atau mau Reply yang sederhana ini codenya :

<span><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=ID BLOG ANDA&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=450,height=450&quot;); return false;'>[Balas]</a></span>

atau mau yang menggunakan image ini codenya :

<a href='http://www.gerbangmini.co.cc'><img alt='GM' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii9pMq_rfe3x4Rr4gdNZE32V28Lj15gG6fe8obqOe_j1Tei3RSIp_HRKstC8kNKGvopjm0J545b-0TT7NHcVKhOUppPfr5VuzAnlFCyixCEx4HGprpo6ohwRirhwR2mMNFuqF4xm5rmMjZ/s1600/best+blogger+tips.png'/></a><span class='comment-reply'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=ID-BLOG-ANDA&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.openundefinedthis.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi08Ui1y9JdcNwa5q2AGdLYx_28h2Qi2n52ztfMJskqydZcaKp_Kwx2LNb6N2d3R5Rq_WCAca9mMrfRNP23buiWs_JqurLz-Jc_lecYzkXzLy_EN36GN-lsDHJSIJ38ZMSB1aV6VEmz-mhi/s1600/Reply+Button+1.jpg' style='float:right;' title='Reply To This Comment'/></a></span>

pilihan salah satu code gambarnya dibawah ini


1.


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgy6aECnShlihH8XZTrRvqWpaf8R8p-n2As42eKDxhDYtLiW6xmEzTpY1IWlRiN9JnmRB7ulnM9bgWPWMOBokWujlk9xARz7EuV0tZ5XBYs1XR9I-igtPsG5B_ZgjavLhsAeW9BIDxmym1M/s1600/Reply+Button+5.jpg' style='float:right;' title='Reply To This Comment'/>

2.


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2HS7xxX2lSzzusBHkHmPT1VYDzAoENAFjuETk29kBJuRdPiKLheNPXOArdjeXLLrzka0GO4EaC9JVewhSxXh1TvStljgZKk98adwoPYEGHNnF3k1HXkOnxwjl0WtuWLuH4QVCgHN0pYiP/s1600/Reply+Button+4.jpg' style='float:right;' title='Reply To This Comment'/>

3.


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCANCrFXvno5tomR50bT2w7OGRkdHvfcGRRV4Bo8Wjhqau4N7rpKzaKu17SET-7t0YB2194qM2-ZnRyOrvqgNess_D8e0BEH3AMcIoZn0E4cBtkwoL4rGOvXe2sBZjUYYVbWNdYruUk8Uk/s1600/Reply+Button+3.jpg' style='float:right;' title='Reply To This Comment'/>

4.



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU6fvn-0DRDgpkW58-60GsaTDPtu5FRrrKSKe8t6gIKFFfRsP4ksAjdJ-KX0nxoTdQi-gJhVxBSB8wp8pY_OsO_UdXhtt92ZJmPHCmPdZNbgzRH1jA1uaLIPdxVC0pWAFJ4-kyXd18geAm/s1600/Reply+Button+2.gif' style='float:right;' title='Reply To This Comment'/>

5.


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi08Ui1y9JdcNwa5q2AGdLYx_28h2Qi2n52ztfMJskqydZcaKp_Kwx2LNb6N2d3R5Rq_WCAca9mMrfRNP23buiWs_JqurLz-Jc_lecYzkXzLy_EN36GN-lsDHJSIJ38ZMSB1aV6VEmz-mhi/s1600/Reply+Button+1.jpg' style='float:right;' title='Reply To This Comment'/>

6.




<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhL6zrGXHXCOQ-64noDMiMZzCuJgp-1Lte3WwUUO5MtJnQ9wyYgrpnlwSFl-Wd1Aynudf8-emuBURrodxdTrYp01clQp2D_oixwN8aRrR8YymRRsou6jfiIIgLCxtovQU1B7PklraLvZdAe/s1600/Reply+Button+10.gif' style='float:right;' title='Reply To This Comment'/>

7.



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCctGo7X9KCTWCvqJkcxemtA7ym_CIsUaW76QQQ4XVJ6Vywb5PfKkxclpeyDP3bME1FUZnwQ8ML-NANc3kWANOplPltXgg76WO64Dn6vVGmltKkAenIsjD3eV3kufvA4Ou99wdz43E6V9M/s1600/Reply+Button+8.gif' style='float:right;' title='Reply To This Comment'/>

8.


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1SNPmRmwMHF3eEz5kDsT6eEk_-K5vhpmapJBZDWaWCpbVyoENGIfE_ZpcAfxartP1sQjlTzhLn0KQmLHYuqvQLYHvpcLTOYtwvOgNdLJkrtZ1L8sEbubwsvglFSjlKemGsNurt0GF3mmi/s1600/Reply+Button+7.png' style='float:right;' title='Reply To This Comment'/>

9.


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGkpMlgcXrS2SSeo1EYm01LgWjfV_uu723aUDZqxubRoDDXDcaPcfGPrWvvnrBbcpjJTSYdhpB3BAbe10xpJEtWVuTHJcm9qrK7GSJl4y3jMjkJxON9ZqhdSS9t7QRTS3uZysFFIM0ULkF/s1600/Reply+Button+6.gif' style='float:right;' title='Reply To This Comment'/>

10.



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVliXWE1kqBiHuCX8ABA8EopIyMwr_Y5hsFEvL2IhNYaGuBmSX15ThHXzWAYydXiPZ9Y5s9X3MGdPjSvRGl0y6E3GIWBru3yVoUQTIfqGhtn7imhAQ7zsepc0jK9uyinKDiCfFAyBgY1e-/s1600/Reply+Button+9.gif' style='float:right;' title='Reply To This Comment'/>

11.



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-5P4r7-SQWyfK9kpc1qh5l-imC20jlKdSknmHM9eoB5FhKvGX_D-NUQUkCckLA-YCu_hAmzj7Hy4JrAuPSfdoPcT9h8PQyVg1TLHjaO2gLk0wfU2ge7rjdc_AO6tuZ78XVMHhVx6a5so/s1600/al.gif' style='float:right;' title='Reply To This Comment'/>

12.


<img src='http://stashbox.org/1087632/anigif.gif' style='float:right;' title='Reply To This Comment'/>


lihat tulisan berwarna merah, itu adalah tempat anda menempatkan ID blog anda untuk ID blog, kalian dapat melihat di kolom browser anda bertuliskan http://www.blogger.com/............?blogID=(disini id blog bertuliskan angka)


untuk tulisan berwarna BIRU itu kode warna baground button
untuk tulisan berwarna HIJAU itu kode warna garis tepi baground
untuk tulisan berwarna COKLAT itu kode warna untuk tulisan BALAS
untuk tulisan berwarna crem itu kode image

dan untuk tulisan BALAS itu tulisan buttonnya dan semuanya dapat kalian ganti sesuai selera kalian, untuk Code warna kalian dapat melihatnya disini
sudah selesai semuanya silahkan di save.
-:: SEMOGA BERMANFAAT ::-
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Gerbang Mini

13 komentar:

shida saje mengatakan...

cantik amat comment box nya ^_^

Jasa Pembuatan Radio Streaming mengatakan...

wah lumyan membantu juga mas infonya,.,..,.,!!

Kka Ardian mengatakan...

@shida saje kamu juga cantik :)

Kka Ardian mengatakan...

@Jasa Pembuatan Radio Streaming semoga ada manfaatnya yah gan :D

Wanzi mengatakan...

nice netry... saya suka

Kka Ardian mengatakan...

@Wanzi tahanks :)

Esson_Barreto mengatakan...

infonya mantap Gan...

Kka Ardian mengatakan...

@Esson_Barreto semoga bermanfaat gan

Er'end mengatakan...

Nice info sob,makasih infonya!
Papua hadir pagi,happy weekend!

Kka Ardian mengatakan...

@Er'end sama-sama gan :) moga betah disini yah

ichsan afriadi mengatakan...

kok kodenya disaya gk ada ya

Kka Ardian mengatakan...

@ichsan afriadi memang kode tamplate gak sama semuanya, coba gan fokus di name='commentDeleteIcon' cari pakai CTRL+F jangan lupa pula Expand Tamplate Widget di tandai terlebih dahulu

Fardiana Fahrudin mengatakan...

Siap ndan...info keren...follow back donk...ane tunggu

Posting Komentar

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Jendela Mini - All Rights Reserved
Template Modify by Creating Website
Proudly powered by Blogger