Cara Membuat Kotak Komentar Berbeda Warna Untuk Admin di Blogspot

Viyan Pradita Kamis, September 02, 2010

Sering saya jumpai pada saat blogwalking saya kadang bingung sendiri, mana komentar yang punya blog (admin) dan mana komentar pengunjung. Nahh karna hal itu kali ini saya akan bahas tentang bagaimana cara membuat kotak komentar untuk admin, itu berbeda dengan yang lainnya. ini akan mempermudah bagi pengunjung untuk membedakan mana admin mana user/pengunjung yang berkomentar. padahal saya sendiri juga belum memasangnya.. hihihi.. yawdah kalo begitu mari kita pasang bareng-bareng.

Lihat Gambar

Ikuti langkah-langkah berikut ini :

1. Login ke Blogger
2. klik Tata Letak dan pilih Edit HTML
3. Kalau sudah, klik Expand Template Widget
4. Lalu cari kode berikut (Ctrl + F)

]]></b:skin> atau ]]</b:skin>

5. Copy paste-kan kode di bawah ini persis berada di atas kode di tersebut :

.comment-body-author {
background: #F2F2F2;
border:1px dotted #000000;
margin:0;
padding:0 0 0 20px;
}

Keterangan :
Tulisan berwarna merah adalah warna background kotak komentar sobat (admin), sedangkan tulisan yang berwarna biru adalah garis border kotak komentar sobat (admin).
Neh buat membantu sobat bilan bingung untuk memnentukan warna klick disini

6. Maih lanjut neh, selanjutnya carilah kode beriku ini :

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

Dan jikalau kode tersebut tidah ada bisa juga dengan kode ini :

<dl id='comments-block'>

Perhatikan kode berikut :

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>

</b:if>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

7. Sobat bisa melihat kode yang berwarna biru pada script diatas, itu merupakan kode tambahan dan yang berwarna hitam itu adalah kode aslinya, sobat hanya perlu copy paste dan masukkan kode yang berwana biru tersebut persis diantara kode yang berwarna hitam di atas.
8. Jika sudah, klick simpan, dan lihatlah hasilnya.

Semoga bermanfaat.

Ditulis Oleh :

Artikel Cara Membuat Kotak Komentar Berbeda Warna Untuk Admin di Blogspot ini dipublish pada hari: Kamis, September 02, 2010. Semoga artikel ini bermanfaat untuk Anda. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.

9 komentar
Terjun Ke Kolom Komentar

  1. pengin nyoba masang nie.., tapi kok kelihatannya rumit.. y

    BalasHapus
  2. MUdah saja sob...
    gak ada salahnya buat nyoba :)

    BalasHapus
  3. udah ane coba, dan berhasil.. :D
    kalau ga keberatan, koment baliknya ya sob,hehe :)

    BalasHapus
  4. Duh kenapa ga ngefe ya di blog saya mah, padahal udah sama langkah-langkahnya juga

    BalasHapus
  5. @AcerNoval; Sip masbro...
    @Asgin: Wah masa sih bro?? udah betulkah penempatan kode2nya.. coba di cek lagi bro :)

    BalasHapus
  6. kang @viyan ?

    kalau ganti avatar si commentar yang menggunakan NAME/URL gimana ya?
    biasanya kan gak ada avatar bagi yang commentar NAME/URL atau anonim

    BalasHapus
  7. thk' infonya sangat berguna langsung ke tkp.

    BalasHapus
  8. tengkyu infona bro.... pengen bikin yang 3 level

    BalasHapus

Catatan:
Link hidup dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE</i>
Kode yang panjang bisa menggunakan tag <i rel="pre">KODE PANJANG</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS DI SINI...</i>


web design blogs Bloggers - Meet Millions of Bloggers