Pages

Modifikasi Komentar Author dengan Background Gambar

Modifikasi Komentar Author dengan Background Gambar. Akan membuat komentar author kelihatan berbeda dan cantik, Caranya :

• Masuk ke blogger
• Pilih design / rancangan
• Pilih edit HTML
• Centang pada ” expand widget template “
• Cari kode <data:comment.author/> atau <data:commentPostedByMsg/>
( tip : gunakan ctrl + F )
• Setelah kode tersebut ketemu, lalu scroll ke bawah hingga menemukan kode </dt>
• Dan letakkan kode berikut ini setelah kode </dt> tersebut.

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

• Lalu, scroll lagi ke bawah hingga menemukan kode </dd>
• Tambahkan kode </b:if> setelah kode </dd> tersebut
• Nah, jika bingung, lihat saja kode berikut ini. Kira – kira seperti itulah peletakkannya

<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’>

Keterangan :
Kode warna merah adalah kode yang ditambahkan
Kode warna orange adalah kode yang harus ditemukan

• Lalu, tambahkan kode CSS berikut di atas kode ]]></b:skin> jika tidak berhasil, letakkan di tag comment, letakkan setelah kode
comment-author { . . . } ket: titik-titik dimisalkan kode yang lain (Gunakan Ctrl + F untuk mencari kode )

.comment-body-author {
margin:0px;
padding:5px;
color:#000000;
background: url(URL GAMBAR/ANIMASI) bottom right no-repeat;
border: 3px solid #CCC;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;font-size:1.8em;line-height:1.9em;font-style:italic;font-
family:Century Gothic;
}

• Keterangan : Ganti URL GAMBAR/ANIMASI dengan alamat gambar atau animasi yang akan dijadikan background. Untuk mengubah posisi gambar, ganti kode bottom right
• Simpan

0 komentar:

Posting Komentar

Jangan lupa komentarnya,Terimakasih atas komentar anda
(Do not forget to comment, Thank you for your comment)

Related Posts Plugin for WordPress, Blogger...

Followers