Komentar Pengulung

Biasanya komentar antara pengunjung dan pemilik blog mempunyai tampilan yang sama. Karenanya kadang si pengunjung sulit membedakan mana yang komentar pengunjung dan yang mana jawaban pemilik blog. Untuk itu biasanya pemilik blog menyiasati dengan memberi tampilan warna background yang berbeda atas jawaban untuk pengunjung. Untuk sobat yang ingin tampilan kotak komentarnya berbeda dan belum tahu caranya bisa ikuti cara di bawah ini.
Di bawah ini adalah cara membuat komentar pengunjung berbeda dengan pemilik blog (admin )

• Login ke blog sobat.
• Pilih tata letak.
• Klik edit html.
• Beri tanda centang pada Expand template widget.
• Cari kode yang mirip di bawah ini, kemudian tambahkan kode yang berwarna merah.
  
  /* Comments ----------------------------------------------- */
  #comments h4 {
  margin:1em 0;
  font-weight: bold;
  line-height: 1.4em; text-transform:uppercase;
  letter-spacing:.2em;
  color: #999999;
  }
  #comments-block {
  margin:1em 0 1.5em;
  line-height:1.6em;
  }
  #comments-block .comment-author {
  margin:.5em 0;
  }
  #comments-block .comment-body {
  margin:.25em 0 0;
  }
  #comments-block .comment-footer {
  margin:-.25em 0 2em;
  line-height: 1.4em;
  text-transform:uppercase;
  letter-spacing:.1em;
  }
  #comments-block .comment-body p {
  margin:0 0 .75em;
  }
  .deleted-comment {
  font-style:italic;
  color:gray;
  }
  #blog-pager-newer-link {
  float: left;
  }
  #blog-pager-older-link {
  float: right;
  }
  #blog-pager {
  text-align: center;
  }
  .feed-links {
  clear: both;
  line-height: 2.5em;
  }
  .admin-comments{
  background:#00CC33;
  border:3px solid #FF9966;
  padding:5px;
  Kode warna merah adalah kode yang harus sobat tambahkan.
  Kode tersebut bisa juga sobat letakkan di atas kode ]]></b:skin> tinggal terserah sobat mau meletakkannya di mana.
  Kemudian kita juga bisa mengganti warna background ,sobat bisa menyesuaikan kode warnanya dengan warna template sobat. Bisa lihat Kode warna di sini
  
• Setelah selesai meletakkan kode di atas tarik scroll ke bawah, cari kode seperti di bawah ini dan tambahkan juga kode yang berwarna merah.
  
  <data:comment.author/>
  </b:if>
  <data:commentPostedByMsg/>
  </dt>
  <b:if cond='data:comment.author == data:post.author'>
  <dd class='admin-comments'>
  <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'>
  
• Kode yang berwarna merah adalah kode yang harus sobat tambahkan.
  
• Jangan lupa klik pratinjau terlebih dulu, jika tidak muncul peringatan baru klik simpan.

Posted in: Tips Blogger