Cara Merubah Tampilan Komentar Blogger - Part 2

April 15, 2012

Bissmilah
Akhirnya datang juga hari Minggu, waktunya posting Cara Merubah Tampilan Komentar Blogger - Part 2.
Kemarin kita sudah membahas Cara Merubah Tampilan Komentar Blogger - Part 1 dan kali ini kita lanjutkan tutorialnya, bagi yang berminat mengganti tampilan komentarnya silahkan praktekkan cara ini, dan yang sudah terlanjur membuat yang Part 1 dan ingin mengganti lagi dengan tampilan yang Part 2 saya sarankan untuk berhati-hati dalam menghapus kode-kodenya, templatenya lebih baik di Backup terlebih dahulu / Download Full Template untuk mengantisipasi jika ada kegagalan dalam memperaktekkan tutorial ini, nah jika bingung modelnya seperti apa lihat nih gambar berikut atau sobat bisa lihat di blog ini

Tampilan yang Part 2 ini juga terdapat kelebihannya daripada yang Part 1
1. Terdapat Emoticon Onion (kucing)
2. Komentar Admin berbeda dengan visitor
3. Terdapat ucapan terimakasih untuk visitor secara otomatis
4. Style Reply beraliran WP (Wordpress)
5. Terdapat gambar disebelah kiri nama Admin yang dapat diubah
6. Font untuk Admin berbeda

Cara Merubah Tampilan Komentar Blogger - Part 2

Langkah 1
Login ke Blogger
Masuk ke "Rancangan - Edit HTML"
Cheklist "Expand Template Widget"
Langkah 2
Gunakan ctrl-f dan letakan kode CSS dibawah ini sebelum kode: ]]></b:skin>

/* Comments
----------------------------------------------- */
#comments h4 {
font-size: 18px;
font-weight: normal;
margin: 20px 0;
}
.cm_wrap {
clear: both;
margin-bottom: 10px;
float: right;
width: 100%;
}
.cm_head {
margin: 0;
width:60px;
float: left;
}
.cm_avatar {
margin: 0;
vertical-align: middle;
border: 1px solid #DDD;
padding: 3px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbNPOn95WjlyswN0ZU-bJibnIa4lzbAILXfPimb3i7myZxOD046IcKNurZi5klNprvz0UXeF9mzkH4k1jGpql5w_Ds3mPLRVAAapwsGMXnYcD46HxlLqeqsMxctAI3_lNy_aIXfYb80Vw/s1600/takdikenal.jpg) center no-repeat;
width: 35px;
height: 35px;
}
.cm_avatar_a {
margin: 0;
vertical-align: middle;
border: 1px solid #DDD;
padding: 3px;
background:#c6e5f7;
background-position:center;
background-repeat:no-repeat;
width: 35px;
height: 35px;
}
.cm_reply {
padding-top: 5px;
}
.cm_reply a {
display: inline-block;
margin: 0;
padding: 1px 6px;
border: 1px solid #C4C4C4;
border-top-color: #E4E4E4;
border-left-color: #E4E4E4;
color: #424242 !important;
text-align: center;
text-shadow: 0 -1px 0 white;
text-decoration: none;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background: #EDEDED;
background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, white), color-stop(1, #E5E5E5) );
background: -moz-linear-gradient( center top, white 20%, #E5E5E5 100% );
font: 11px/18px sans-serif;
}
.cm_reply a:hover {
text-decoration: none !important;;
background: #ccc;;
background: -webkit-gradient(linear,left top,left bottom,color-stop(.2, #eeeeee),color-stop(1, #cccccc));;
background: -moz-linear-gradient(center top,#eeeeee 20%,#cccccc 100%);;
}
.cm_entry {
padding: 16px;
background: #fcfcfc;
border: 1px solid #E4E4E4;
overflow: hidden;
}
.cm_arrow {
display: block;
width: 9px;
height: 18px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVwBqXYOm7b1x2g-tdCGWJ0QyukdUbYtHOrqQwc5tbDo6dyQt2rEnTq_xFfO8SoseZIKfpGCayoJsD-0qoJmcRMuwMI3crVscGb8_OOs8XvytF07la7uDXR-zAQss5_FuevrXPNXVIevM/s1600/comment-arrow.gif) no-repeat;
position: absolute;
margin-left: -25px;
}
.cm_info {
margin-bottom: 5px;
border: thin solid #E6E6E6;
background-color: #F4F4F4;
padding: 5px;
}
.cm_info_a {
margin-bottom: 5px;
border: thin solid #E6E6E6;
background-color: #dff0fa;
padding: 5px;
}
.cm_name {
font-size: 14px;
color: #666666 !important;
text-decoration:none;
float: left;
}
.cm_name_a {
font-family:"Comic Sans MS", cursive;
font-size: 14px;
color: #666666 !important;
text-decoration:none;
font-weight: bold;
float: left;
}
.cm_date {
font-size: 10px;
color: #999;
text-decoration:none;
float: right;
}
.cm_date_a {
font-family:"Comic Sans MS", cursive;
font-size: 10px;
color: #2D5E7B;
text-decoration:none;
float: right;
padding-top:5px;
}
.cm_entry p {
padding: 5px;
clear: both;
border: thin solid #E6E6E6;
background-color: #ffffff;
font-size: 13px;
color: #333;
word-wrap:break-word;
}
.cm_entry_a p {
padding: 5px;
clear: both;
border: thin solid #E6E6E6;
background-color: #ffffff;
font-size: 13px;
color: #333;
word-wrap:break-word;
}
.cm_pagenavi {
font-size: 10px;
text-transform: uppercase;
color: #666;
text-shadow: 1px 1px white;
font-weight: bold;
}
.cm_pagenavi a {
color: #666;
text-decoration: none;
padding:10px;
}
.cm_pagenavi a:hover {
text-decoration: underline
}
.cm_pagenavi span {
color: #888;
background: white;
padding: 4px;
border: 1px solid #E0E0E0;
}
/* Comment Admin */
.comment-body-author {
font-family:"Comic Sans MS", cursive;
font-weight: 300;
}

Langkah 3
Setelah itu taruh kode dibawah ini diatas kode </body>

<b:if cond='data:blog.pageType == "item"'>
<script src='http://koderator.googlecode.com/files/comment.js' type='text/javascript'/>
<script src='http://koderator.googlecode.com/files/emoticon_wp2.js' type='text/javascript'/>
</b:if>

Langkah 4
Langkah ini merupakan langkah penerapan Emoticon, jika sobat tidak ingin memasang emoticon pada komentar sobat maka hiraukanlah langkah ini.
Cari kode <h4 id='comment-post-message'><data:postCommentMsg/></h4>
dan letakkan kode berikut dibawahnya

<b><img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/70bff581.gif' width='30'/>:))

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/069.gif' width='30'/>;))

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_104_.gif' width='30'/>;;)

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_113_.gif' width='30'/>:D

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/4412144b.gif' width='30'/>;)

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_101_.gif' width='30'/>:p

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/33c4b951.gif' width='30'/>:((

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_059_.gif' width='30'/>:)

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/875328cc.gif' width='30'/>:(

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/6f428754.gif' width='30'/>:X

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_087_.gif' width='30'/>=((

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/e111de78.gif' width='30'/>:-o

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/efb50fe2.gif' width='30'/>:-/

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_106_.gif' width='30'/>:-*

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/023.gif' width='30'/>:|

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/5c745924.gif' width='30'/>8-}

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/037.gif' width='31'/>:)]

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/042.gif' width='30'/>~x(

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/87a4e689.gif' width='30'/>:-t

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/047352f3.gif' width='30'/>b-(

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/th_116_.gif' width='30'/>:-L

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/4d6161fd.gif' width='30'/>x(

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/d5f02ecd.gif' width='30'/>:-q

<img border='0' height='30' src='http://www.cute-factor.com/images/smilies/onion/071.gif' width='30'/>=))

</b>

</div>

Yang di Blok Biru merupakan lebar wadah emoticon, jadi sesuaikanlah dengan lebar blog sobat

Langkah 5
Lalu cari kode

<b:includable id='comments' var='post'>
kode yang harus di ganti

</b:includable>

Jadi diantara kode dan ada sebuah kode yang agak relatif panjang dan kode tersebut harus diganti dengan kode dibawah ini

<b:if cond='data:post.allowComments'>

<h4>

<b:if cond='data:post.numComments > 0'>

<b:if cond='data:post.numComments == 1'>

<b:else/>

</b:if>

</h4>

<b:loop values='data:post.comments' var='comment'>

<b:if cond='data:comment.isDeleted'>

<b:else/>

<b:if cond='data:blog.enabledCommentProfileImages'>

<data:comment.authorAvatarImage/>

</b:if>

</div>

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

</div>

<b:if cond='data:comment.author == data:post.author'>

<b:if cond='data:comment.authorUrl'>

<data:comment.author/>

</a>

<b:else/>

</b:if>

</div>

<data:comment.timestamp/>

<b:include data='comment' name='commentDeleteIcon'/>

</div>

</div>

</div>

</dd>

<b:else/>

<b:if cond='data:comment.authorUrl'>

<data:comment.author/>

</a>

<b:else/>

</b:if>

</div>

<data:comment.timestamp/>

<b:include data='comment' name='commentDeleteIcon'/>

</div>

</div>

<span style='text-align:center; font-size:9px;'>Terimakasih <b><data:comment.author/></b> atas Komentarnya di <b><data:post.title/></b></span>

</dd>

</b:if>

</div>

</b:if>

</b:loop>

</div>

<b:if cond='data:post.embedCommentForm'>

<b:if cond='data:post.allowNewComments'>

<b:include data='post' name='comment-form'/>

<b:else/>

<data:post.noNewCommentsText/>

</b:if>

<b:else/>

<b:if cond='data:post.allowComments'>

</b:if>

</div>

Hal ini sangat penting, pada langkah 5 cari tulisan __BlogID__ dan ganti tulisan tersebut dengan BlogID sobat

Langkah 6
Kemudian cari kode seperti dibawah ini

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>

Biasanya ada 4 kode yang serupa dengan kode di atas, maka dari itu ganti semua kode tersebut dengan kode ini

<b:include data='post' name='comments'/>

langkah Terakhir
Klik Simpan Template

Update..!!!

Karena ada yang bertanya dan kebingungan pada langkah 5, untuk itu saya coba beri penjelasan kode yang harus dicari dan diganti

<b:includable id='comments' var='post'>

<b:if cond='data:post.allowComments'>

<h4>

<b:if cond='data:post.numComments == 1'>

1 <data:commentLabel/>:

<b:else/>

<data:post.numComments/> <data:commentLabelPlural/>:

</b:if>

</h4>

<b:if cond='data:post.commentPagingRequired'>

<data:post.commentRangeText/>

</span>

</b:if>

<b:loop values='data:post.comments' var='comment'>

<b:if cond='data:comment.favicon'>

</b:if>

<b:if cond='data:blog.enabledCommentProfileImages'>

<data:comment.authorAvatarImage/>

</b:if>

<b:if cond='data:comment.authorUrl'>

<b:else/>

<data:comment.author/>

</b:if>

<data:commentPostedByMsg/>

</dt>

<b:if cond='data:comment.isDeleted'>

<b:else/>

<p>

<data:comment.body/>

</p>

</b:if>

</dd>

<data:comment.timestamp/>

</a>

<b:include data='comment' name='commentDeleteIcon'/>

</span>

</dd>

</b:loop>

</dl>

</div>

<b:if cond='data:post.commentPagingRequired'>

<data:post.oldestLinkText/>

</a>

<data:post.olderLinkText/>

</a>

<data:post.commentRangeText/>

<data:post.newerLinkText/>

</a>

<data:post.newestLinkText/>

</a>

</span>

</b:if>

<b:if cond='data:post.embedCommentForm'>

<b:if cond='data:post.allowNewComments'>

<b:include data='post' name='comment-form'/>

<b:else/>

<data:post.noNewCommentsText/>

</b:if>

<b:else/>

<b:if cond='data:post.allowComments'>

</b:if>

</p>

</b:if>

<b:if cond='data:showCmtPopup'>

</iframe>

</div>

</b:if>

<b:if cond='data:post.showBacklinks'>

<b:include data='post' name='backlinks'/>

</b:if>

</div>

</b:includable>

Untuk kode yang saya blok merah merupakan batas menghapus kodenya.
Ingat !!! Setiap template mungkin beda kode

Semoga bermanfaat, selamat mencoba dan semoga berhasil

Labels: Blog Design

155 Komentar:

Tedi Kurniawan said on April 19, 2012 at 8:21 PM

mas,maksud yg Langkah 5 itu gmna?? kurang ngerti :-/

Muhammad Irham said on April 21, 2012 at 2:37 PM

@Tedy Kurniawannih gan ane jelasin, pada kode langkah 5 itu ada sebuah kode yang agak panjang, dan yang ane tulis diatas cuma awalan dan akhiran saja, jika agan kebingungan untuk mencari, agan coba cari kodenya yang awalan saja kalau sudah ketemu coba telusuri sampai bawah dan jika menemukan kode akhiran agan hapus diatasnya sampai kode awalan tadi. semoga berhasil gan :|

Din Hikmah said on April 22, 2012 at 5:53 AM

bermanfaat sekali om..uda terpasang di web ane..
thanks for info..

Unknown said on May 1, 2012 at 1:49 PM

thanks tipsnya gan...:))

http://zopran.blogspot.com

Putra said on May 2, 2012 at 6:03 PM

artister tuh mah :))

Muhammad Irham said on May 2, 2012 at 7:23 PM

@Alam Perwira :-/

isha shourai said on May 3, 2012 at 1:32 PM

yeeee, berhasiiill .. yeyeyeee :D

Roza liana said on May 3, 2012 at 2:59 PM

bingung.com di tahap 5,, dan akhirnya menyerah
:((

Dunia Ilmu Pengetahuan said on May 3, 2012 at 4:35 PM

udah ane praktekin bro di Dunia Ilmu Pengetahuan
:P
Mantap tutornya
:X
:)]
x(

Muhammad Irham said on May 4, 2012 at 2:27 PM

@Roza liana coba liat kode lengkapnya
disini sist, kodenya terletak pada bagian akhir posting. Kode tsb merupakan kode lengkapnya agar ngk kebingungan. Good luck

Muhammad Irham said on May 4, 2012 at 2:44 PM

@Muhammad Irham disini

Shirayuki said on May 6, 2012 at 12:41 AM

Mas,, Kok Foto nya Gak Muncul yah?
mohon Bantuan nya
http://mangasnow.blogspot.com/

Muhammad Irham said on May 6, 2012 at 7:23 AM

@Snow Skill foto komentar adminnya / pengunjungnya?, kalo adminnya, coba agan ke Dasbor dan pada profil agan tambahin foto agan.

Unknown 1 said on May 6, 2012 at 11:57 PM

wehehee, mantepp banget tuh.... hehe.....
tapi bikin berat ga sob?
mampir balik ya? :D

Muhammad Irham said on May 7, 2012 at 2:59 PM

@Fahmi Setiawan insyaAllah ngak sob, tutor ini kan hanya replace kode-kode doank, selebihnya jika berat itu berarti dampak dari emoticon

Unknown said on May 10, 2012 at 9:34 AM

Blognya bagus bro ..:-q

:-/ kayaknya baru di bangun tahun ini udah bisa dapet pagerank 2 .. gimana caranya ..??
bagi-bagi dong tipsnya buat dapet pagerank hihihihi :)

link balik yahg ,
Salam kenal

http://dyan-seller.blogspot.com/

Free Download said on May 10, 2012 at 4:32 PM

gan kok gak mau yah di blog saya...??
dari langkah 4 ampe akhir saya cari scripnya gak ada...

Muhammad Irham said on May 10, 2012 at 4:40 PM

@Raden Chopin trimakasih gan ;;) . nanti tak buatin tipsnya :)

Muhammad Irham said on May 10, 2012 at 4:47 PM

@Free Download setiap template kodenya beda-beda gan dan pada langkah 4 kode tsb tidak terlalu berpengaruh karena kode tsb berperan menempelkan gambar imoticon

Iim KunKun said on May 12, 2012 at 1:02 PM

makasihhhhhhhhhhhhhhhhhhh :D
:-q

Dasir said on May 16, 2012 at 3:04 PM

mav kk,
pas gw search yang langkah 4
nggk ada tuh, gmn yh??

Muhammad Irham said on May 17, 2012 at 10:22 AM

@kuringedan memang dalam kode template beda2 gan, maka dari itu coba cari yg agak mirip2 aja.

Anonymous said on May 17, 2012 at 1:15 PM

thnks gan atas ilmu yang telah diberikan:) ,,soalnya saya telah berhasil mempraktekkannya,,salam persahabatan selalu

Julius Nyuk Nyuk said on May 21, 2012 at 6:59 PM

Blog ID nya ditimpah ma kode qta gan ??

Julius Nyuk Nyuk said on May 21, 2012 at 7:07 PM

berhasil gan >> thankz
juliusnyuk2.blogspot.com =((

Romi Ramdhani said on May 24, 2012 at 9:19 PM

langkah 5 nya gak ngerti GAN!!!
Please di bantu yaaa :p

Romi Ramdhani said on May 24, 2012 at 9:30 PM

bisa kasih yg lebih jelas gak di tutorial 5 nya gan??
seperti screen shoot gitu lah mas!!

Romi Ramdhani said on May 24, 2012 at 9:43 PM

KOK SAYA PUNYA KELUAR TULISAN KAYAK GINI GAN??
=>>

Kami tidak dapat menyimpan template Anda.
Harap perbaiki kesalahan di bawah, dan kirimkan template Anda lagi.
Widget dengan id "Header1" tidak dapat mengandung elemen "div". Sebuah widget hanya dapat mengandung elemen b:includable.

Muhammad Irham said on May 24, 2012 at 10:09 PM

@Blog Reze brarti ada yg masih salah gan.

Unknown said on May 26, 2012 at 3:17 AM

lumayan gan
makasih buat ilmunya:))

Purna Paskibraka Indonesia said on May 31, 2012 at 1:15 PM

Matur Nuhun....
Ilmunya sangat bermangfaat...

yandh said on June 1, 2012 at 4:27 PM

gan mau tanya, caranya udh berhasil, tapi avatar ane sama pengunjungnya gak muncul..
itu gimana ya? tolong pencerahanya dong gan

Pass2x said on June 3, 2012 at 7:16 PM

trimakasih mas atas ilmunya..

sangat beranfaat

Muhammad Irham said on June 3, 2012 at 7:24 PM

@yandh itu karena komentar sebelumnya sudah direplace dengan kode ini dan sebab yang terjadi adalah foto yg sblumnya ada jadi kehapus/terpindahkan dan jika kita sudah mengunakan tampilan yg ini maka stiap ada pengunjung yang komentar maka fotonya akan tampil

Marudut said on June 8, 2012 at 2:39 AM

Trimakasih Sob atas infonya..udah tak praktekin..berhasil..thx:))

yandh said on June 9, 2012 at 11:28 AM

@Muhammad Irham Tapi ini malah gak tampil fotonya gan. Gimana dong?

Raden Rambu said on June 14, 2012 at 6:07 PM

keliatannya agak susuah, tapi di cobak aja dlu dahhh,,,,
:))

Yugosh™ said on June 15, 2012 at 11:53 AM

kalau mau ganti warna admin gimn ya???
ini kan warna biru dikit gelap.... :p

thanks untuk tutorial nya..... bergunaaa sekali
:-q :-q :-q :-q :-q :-q :-q :-q

Yugosh™ said on June 15, 2012 at 11:55 AM

@Yugosh™

1 lagi... reply sana gagal muncul

Not Found
Error 404

kenapa ya??? bisa di bantuuu???

Muhammad Irham said on June 15, 2012 at 7:49 PM

@Yugosh™ untuk membetulkan reply coba cari kode __BlogID__ kemudian ganti dengan ID blog sobat, dan warna admin bisa dicari pada kode CSSnya

admin said on June 17, 2012 at 2:13 PM

okeh terima kasih tutorialnya bermanfaat bgt n BERHASIL di blog ane ,,, http://adybakom.blogspot.com
tpi mau tanya nich min bagaimana membuat komentar ber CAPCHTA seperti admin mohon dishare ,,, semoga Allah membalas budi kebaikan n share dari admin blog ini ,,, :p

Bocah Blogs said on June 17, 2012 at 8:37 PM

kok emotionx gak fungsi ya bang???

Muhammad Irham said on June 18, 2012 at 9:57 AM

@ady davedevil kalau capaca agan pergi ke setting komentar saja, maka disitu akan ada setting bwat capcanya

S.W. Tech. said on June 19, 2012 at 1:14 PM

Thanx gan, sdh berhasil ane coba... :)
mampir ya gan.... :)]

http://s-w-tech.blogspot.com/

DennisMunthe said on June 20, 2012 at 10:34 AM

gan,emotionx nya kok gak fungsi?
mohon bantuannya

hasanphoto.blog said on June 21, 2012 at 8:03 PM

gag bs gan -____-"

ketagihan baca said on June 21, 2012 at 8:54 PM

Mantep gannn... udah ane coba... pertama gagal, setelah kedua kali lgsg berhasil.... thnks gan triknya.... mampir gan di liat hasilnya. hehe

Irma Elita said on June 24, 2012 at 8:07 AM

kakak punyaku yang komentar adminnya gak menjorok ke dalam kayak punya kakak :((

i Post said on June 24, 2012 at 8:09 AM

hehehe sob saya lagi nih sob :D :-q .........

sob tutornya berhasil tapi kok muncul tulisan kaya gini ya sob + coments + :-/ :-/

cara ganti kaya punya sampeyan itu gimana ya ada tanda panahnya mohon batuannya ya sob hehehehehe......:)) :)) :)) :)) :))

i Post said on June 24, 2012 at 8:08 PM

berhasil gan tapi kok muncul yang beginian ya...

+ comment +

cara ngilanginnya gimana tuh gan.....

Muhammad Irham said on June 25, 2012 at 5:10 AM

@i Post kalau itu emang sengaja saya kasih gan, menurut saya ngak usah di ilangin karena gunanya agak penting, cukup diganti saja +comment+ dengan yg agan mau misal "tambahkan komentar" dll

Seputar Informasi TIK said on June 25, 2012 at 9:29 PM

makasih tutorialnya ya..
jadi makin betah ngeliat blog ane :))

BlazManga™ said on June 26, 2012 at 7:55 PM

:))

Unknown said on June 27, 2012 at 12:23 PM

@Muhammad Irham

testing!

romadhon-byar said on June 27, 2012 at 11:48 PM

wah ... Keren banget gann... :D
Thanks ya :D

LP said on June 28, 2012 at 3:45 PM

sob kok ada komentar yg gk masuk........

Muhammad Irham said on June 28, 2012 at 7:49 PM

@LP terkadang harus saya setujui

Unknown said on June 28, 2012 at 9:35 PM

step yg terakhir kurang ngerti saya sob, tolong diperjelas..

Anonymous said on June 29, 2012 at 3:00 PM

Terima kasih sob atas tutorialnya, saya berhasil. Tapi kalau ingin nama pengirim commentnya dibikin bold seperti punya agan gimana caranya sob? trims.

Muhammad Irham said on June 30, 2012 at 8:13 AM

@Pangestu Panji Pratama Pada kode CSS cm_name tambahin font-weight: bold;
nanti hasilnya seperti ini
.cm_name {
font-size: 14px;
color: #666666 !important;
text-decoration:none;
font-weight: bold;
float: left;
}

Anonymous said on July 1, 2012 at 12:45 AM

mantep banget

Efendy bloggers said on July 1, 2012 at 11:44 AM

This comment has been removed by the author.

LP said on July 3, 2012 at 10:19 AM

@Muhammad Irham
ooouuwwhhh jadi komentar yg di tutorial ini juga pake sistem persetujuan ya......

Anonymous said on July 4, 2012 at 11:42 AM

nice info gan.. ane udah coba di blog ane dan berhasil sankyuu ^^

Unknown said on July 7, 2012 at 8:01 PM

jangan lupa
kunjungi rulasr.com

Obat tradisional HIV AIDS said on July 10, 2012 at 2:31 PM

boleh juga untuk di pelajari .....

agen obat said on July 10, 2012 at 2:32 PM

info yang sangat menarik buat para bloger yang lagi mencari kode ini ..../??

Sopyan-7 said on July 11, 2012 at 7:48 PM

Gan ane udah berhasil Nih , Cuman cara buat menghilangkan :
Fitur
-Terdapat ucapan terimakasih untuk visitor secara otomatis

Gimana tuh ?

Mohon pencerahan nya :D

Muhammad Irham said on July 12, 2012 at 9:43 AM

@Sopyan Or Uzop hapus kode ini

<p><data:comment.body/></p>
<span style='text-align:center; font-size:9px;'>Terimakasih <b><data:comment.author/></b> atas Komentarnya di <b><data:post.title/></b></span>

Blogger Pemula said on July 12, 2012 at 5:22 PM

sob, saya udah merubah tampilan komentar blog saya dengan mengikuti tutorial cara mengubah tampilan komentar part 1. Tapi pas saya mau masang emoticon kucing yang dari tutorial part 2, kenapa ko ga bisa muncul ya emot nya??

Hervin said on July 13, 2012 at 5:54 PM

Wah berhasil, makasih gan atas infonya. semoga blog ini bermanfaat buat yg lainnya

Lintang EM said on July 14, 2012 at 6:55 PM

Thanks gan. Berhasil.. Vsit back gan : http://lintangannisa.blogspot.com

Unknown said on July 15, 2012 at 12:47 PM

bang di blog ane kagak bisa..

Muhammad Irham said on July 15, 2012 at 3:19 PM

@benny prasetya mungkin dalam penerapan kodenya ada yang masih salah sob, coba diteliti lagi

Rangga said on July 19, 2012 at 1:31 AM

ko aku ga nemu yang di langkah 4

Muhammad Irham said on July 19, 2012 at 8:10 AM

@rangga darmawan langkah no.4 merupakan penempatan emoticon, tidak masalah apabila tidak ditempelkan

Tedi Kurniawan said on July 31, 2012 at 7:06 PM

mas yang Langkah 6 gimana maksudnya ?

Muhammad Irham said on August 2, 2012 at 1:40 PM

@Tedy Kurniawan kode yang kaya gitu diganti gan

goez said on August 8, 2012 at 7:17 PM

Tipsnya sangat kreatif, salam kenal sob...

admin said on August 14, 2012 at 2:27 PM

@Muhammad IrhamYang dmnanya kak ??.. bisa tlong ksih tutornya gk .. ???

Putupunyablog said on August 16, 2012 at 6:00 PM

nah, ini dia yang saya cari-cari.. langsung saya praktekan gan :)

cermat seo said on August 20, 2012 at 4:10 AM

suksees sobat,terimakasih nih

Iim KunKun said on August 22, 2012 at 1:53 PM

Maturnuwun

gaptek32 said on September 9, 2012 at 3:10 AM

makasih sob, ijin exe nih

Arief Yustana said on September 11, 2012 at 5:09 PM

Mantaf dah...
Langkah ke 6
yang diganti apanya ya...???
mohon pencerahannya.
Thx U

Efendy bloggers said on September 16, 2012 at 7:24 AM

Gan, part 3 ada nggak?

Irvan kun blogz said on September 19, 2012 at 7:18 PM

info nya sangat berhasil, terima kasih ya ^^

Yandi Mulyadi said on September 20, 2012 at 12:16 PM

Gan Ini Semua Kan Bentuk Tampilan Komentar Wordpress Nah Saya Maunya Bentuk Tampilan kotak komentarnya Seperti di -Mafia Blogger Sitez-

Yandi Mulyadi said on September 20, 2012 at 12:19 PM

Terus Kenapa Kalo Kita Memasang Deskripsi Komentar Contoh :

Berkomentarlah Dengan Bijak

Nah Deskripsinya kan dibawah Tulisan Poskan Komentar , Tapi Saya Pengennya dibagian Deskripsinya itu kita Ganti Background Warnanya ! -Mafia Tutor Blogger-

zzax said on September 20, 2012 at 12:28 PM

maaf, kalo cuma mau ganti font di form komentar gimana caranya yg simple?

kaka-jr said on September 28, 2012 at 11:51 AM

sukses gan,,,
terpasang dengan baik di blog ane...
btw,itu kl code pas emoticon nya ga bz diganti dengan code lain ya?
misal:
:D :X dll diganti menjadi :1 :2 :3 dst
mohon pencerahan nya..^^

vimax- pills said on October 3, 2012 at 11:16 AM

Jual Vimax Pills original Kanada

Barang ASLI dari canada, 100% Herbal.
“Hati – hati Banyak Vimax Tiruan” Yg asli untuk indonesia hanya di disini.
Jika anda berminat Telpon / SMS di 0857-22-632-522 secepatnya akan di respon. Gratis Ongkos Kirim

untuk info : http://www.vimaxpillsindonesia.com

Unknown said on October 4, 2012 at 6:34 PM

cazefa.blogspot.com

pasti gk bakalan nyesel..

akhmad said on October 13, 2012 at 7:52 AM

om kalo mau menampilkan gambar kucing (ato apalah itu g jelas -_-) sebelum komen itu gimana??
jadi biar pengunjung tau kalo di blog kita ada emotnya

Batuahku said on October 13, 2012 at 5:00 PM

gan cara ngilangin tombol reply nya gmna ya?!

jasa penerjemah said on October 24, 2012 at 10:11 PM

mantap gan terimakasih infonya
jasa penerjemah Tersumpah

Muhamad Hafisz Kausari said on October 28, 2012 at 11:42 AM

Mantap Gan....!

jangan lupa kunjungi situs saya :
http://www.aqlink.co.cc

rzcellular said on November 22, 2012 at 9:09 AM

wah it's work sob,. mantab thx,...

U comment I follow,.. ^^

http://www.rzcellular.com

BacaTekno.com said on December 9, 2012 at 12:43 PM

Thanks gan bermanfaaat banget :)
see in www.galang-community.blogspot.com

MF-Abdullah said on December 11, 2012 at 3:34 PM

TQ om Tutornya, akhirnya berhasil juga... hehehe :)

Rizki Cahya Permana said on December 13, 2012 at 5:28 PM

Terimakasih artikelnya, bermanfaat, bisa di chek http://ricahyap.blogspot.com, kak kalo yang emotionnya ko ada yang berfungsi?

Rizki Cahya Permana said on December 13, 2012 at 5:39 PM

@Rizki Cahya Permana mksdnya ada yang ga berfungsi kak., :D

Audi Chandra Yudhistira said on December 16, 2012 at 9:51 AM

Langkah yang ke6 kode in "

" diganti dengan kode ini gan "" jadi kode yg pertama dihapus semua???

Audi Chandra Yudhistira said on December 16, 2012 at 9:58 AM

ehh ehh oh noo hahahah berhasil gan :D, thanks agan o/ sukses selalu :D

rezuard said on December 19, 2012 at 6:05 PM

kalo kata sahrini t.o.p membahana badai hahaha joss gan!

mampir di website saya sinih gan. :)

rezuard said on December 19, 2012 at 6:07 PM

kalo kata sahrini t.o.p membahana badai hahaha joss gan!

mampir di website saya sinih gan. :)

Saung Link said on December 24, 2012 at 8:28 AM

Tutorialnya lengkap dan jelas nih.. siip deh

Anonymous said on December 25, 2012 at 4:19 AM

gan kenapa profile blogger kagak ada gambarnya by mashasih

Ihnuzi said on December 27, 2012 at 7:37 AM

wah makasih ya gan

Jaringan Komputer said on December 29, 2012 at 11:59 AM

Wuih..
bisa diedit2 nih kotak komentar ane...
makasih sob..

Unknown said on January 2, 2013 at 2:34 PM

kok gak bisa-bisa ya? tampilannya tetap sama gak ada perubahan, mohon bantuannya.

Angelica Kirana said on January 3, 2013 at 3:04 PM

gan aku coba di blog tapi ga keluar yang kotak2nya cuma ada emo aja

Jhonarendra said on January 3, 2013 at 4:58 PM

aduh saya gagal memasangnya, kotak komentar malah tidak muncul sama sekali, kira kira kenapa ya cuma muncul "poskan komentar (atom)"?
dari:
Blog Jona Rendra
untung saja jendela Edit HTML belum saya tutup sehingga saya bisa undo semua

Dedysteady said on January 4, 2013 at 12:44 PM

berahasil gan ^^ thanks yaa..

mampir ke blog ane gan Anda tahu? :)

masudahkusuma said on January 6, 2013 at 1:47 PM

waaaahhh kereen...thanks banget sooob....berhasil... hehe
mampir ke blog ane ya gan ,,, hehe

Kusuma Wardhani Mas'udah said on January 6, 2013 at 2:14 PM

oya tanya mas...klo mau meletakkan sumber : Cara Merubah Tampilan Komentar Blogger - Part 2 itu dimananya ya?? mohon bantuannya.. hehe

Artikel Blogger said on January 24, 2013 at 3:17 PM

Mantap Mas Bro

Ahmad said on January 25, 2013 at 5:04 PM

Mantap kang..akan saya coba sekarang kang..

salam kenal aja kang...
ditunggu kunjungannya di home saya..

Axedo said on February 7, 2013 at 5:42 PM

thanks yah gan... berhasil...
kerennnn...
kunjung bslik yah
ax35.blogspot.com

ace maxs said on February 8, 2013 at 7:32 AM

sudah berhasil ni gan, tanks banget ya tipsnya

jelly gamat said on February 8, 2013 at 8:37 AM

baru mau coba ni gan, do'a in saya ya semoga berhasil

ijin ke TKP ni

Unknown said on February 23, 2013 at 1:51 PM

Gan Minta yg backgroundnya hitam (kode warna #242424) trus bordernya hijau gitu bisa gk ? please :D

Blogwalking Sob

Unknown said on February 23, 2013 at 2:33 PM

gan gue gak ada error cuma tampilan gak kayak gini ....
tampilan sama aja kayak standarnya ....

Reynaldi Alfajri said on February 28, 2013 at 1:20 PM

gan kok semua gambar yang komen gk muncul?
www.nekonime.net

Obat Herbal Keputihan said on March 9, 2013 at 10:30 AM

saya belum mengerti nih gan,,maklum lah saya pemula

Unknown said on March 19, 2013 at 12:34 PM

gan,,,udah tak coba,,ga ad eror tp kok tampilan komentar ga ad prubahan,,,pencerahan gan

Unknown said on April 6, 2013 at 12:17 PM

itu gimana cara mengetahui BlogID-nya? ini blog saya http://nekoorenji.blogspot.com

Unknown said on April 6, 2013 at 12:42 PM

aku sudah coba, sebelum disimpan aku coba pratinjau dulu terus ada bacaan begini Template Anda tidak dapat diparse karena tidak well-formed. Harap pastikan bahwa semua elemen XML ditutup dengan benar.
Pesan error XML: The element type "b:includable" must be terminated by the matching end-tag "". itu apanya yang salah? perasaan udah ngikutin sama kyak yang di atas. mohon bantuannya..

Unknown said on April 9, 2013 at 10:59 PM

sudah saya coba dan berhasil

aldi said on April 15, 2013 at 11:15 AM

Modelnya ada yang lain nggak om??

Anonymous said on April 17, 2013 at 8:40 AM

Gk work, yg punya blog aja gk ada emoticonnya di kolom komentarnya. Dan yg penting dalam tutorial blog itu di utamakan DEMO nya. Ini juga gk ada halaman DEMOnya

Anonymous said on April 19, 2013 at 5:05 AM

wow hebat

Unknown said on April 30, 2013 at 9:45 PM

makasih :)
entar kalo mau hapus nya lagi gimana ?
ikutin langkah yang tadi lagi?

Brigade xiv said on May 25, 2013 at 5:37 PM

testing delete buttonya dlu gang.. :D mntap ni css3

Brigade xiv said on May 25, 2013 at 5:38 PM

@Berita Gue
hehe ada juga tuh di bagian pojok.. tapi sayang bngt replay ni malah popup.. :|

Masiki said on July 28, 2013 at 12:29 PM

gan mau nanya nih..
caranya ganti warna tulisan dideskripsi pesan komentar tuh gimna mas.??
tolong ya.. :D

Unknown said on August 3, 2013 at 4:33 PM

BANGG mau tnyak..
jawab fast..
kolom komentar part 2 ini gk bsa diberi tanda admin toh ?
menmakhusina.blogspot.com

Unknown said on August 6, 2013 at 7:38 AM

Foto ga muncul gan... kira2 kalo ga muncul foto admin dan pengunjung, apa yang kurang kodenya??

sma xaverius 1 sekolah terbaik di palembang said on October 22, 2013 at 11:09 AM

Infonya menarik sekali sma xaverius 1 sekolah terbaik di palembang

Unknown said on December 13, 2013 at 1:32 PM

gan kok gak bisa direply

1hati said on December 15, 2013 at 10:01 AM

makasi infonya gan

wongmbeneh@gmail.com said on December 16, 2013 at 11:20 PM

thanks banget infonya ... di update terus ya

Developer Admin said on December 28, 2013 at 2:54 PM

thanks buat infonya gan :))

Anonymous said on January 19, 2014 at 9:59 AM

@Hasan Sholihin test

Nurmat Djou said on February 9, 2014 at 4:10 AM

@Muhammad Irham Tutor sangat membantu, tapi bisa gak ketika klik tombol reply langsung disematkan di bawah untuk membalas komentar. tidak lagi membuka min windows.. Trims n salam kenal aj.

Ash Princess Kawaii said on April 1, 2014 at 1:33 AM

thanks tutorialnya, di tunggu kunjungan baliknya..
Mig33 Eagle & Ash Princess Kawaii

Unknown said on April 12, 2014 at 8:59 AM

Berhasil gan, tpi kok fotonya jadi double ya??

Coba cek gan, http://rizkyalfiranda.blogspot.com/

Never Ending Story said on April 14, 2014 at 9:49 PM

bang kgaaak bisa langkah yang ke 6.. :( itu diganti semua jadi satu.. atau satu-satu ganti?

Anonymous said on May 28, 2014 at 11:04 PM

ko punya saya ematikonnya enggak bisa di klik ya? kenapa?

Benua Ilmu said on August 3, 2014 at 4:07 AM

masih dalam percobaan gan, izin pake ya gan
kunvbval kalo bisa ;)

Anonymous said on September 28, 2014 at 4:31 PM

di template saya gabisa gan.. error