Minggu, 24 Juni 2012

Cara Menampilkan Jumlah Komentar Di Samping Judul Postingan

Cara menampilkan jumlah komentar - Pada edisi kali ini(chailah bahasanya ) Gopar Site akan mencoba menulis Tutorial yang masih berhubungan dengan Komentar Blog. Apakah itu? Yap...benar! Kali ini kita akan mengotak-atik Cara Membuat Jumlah Komentar Disamping Judul Posting. Sebenarnya link jumlah komentar berada disamping judul postingan,dibawah judul posting maupun berada dibawah postingan itu sah-sah saja,tergantung selera Blogger masing-masing. Di Artikel ini Admin hanya berkreasi untuk mempercanting template blog.



Gak usah panjang lebar,jika sobat ingin mencoba menerapkan Tutorial ini,silahkan ikuti Langkah-langkah berikut:

1. Login di Blogger.com
2. Klik "Dashboard" lalu "Design/Rancangan" kemudian "Edit HTML"
3. Jangan lupa "Expand  Template Widget"
4. Cari code ]]></b:skin> ,letakkan CSS berikut tepat diatasnya
.comment-ballon{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHEO268NxFdSKe4XNFN9A_GVoM4yQlxGCnm5dyQzpdDHafdV2iU1bwOUvOjj0OMSQWTITi4i_abVHr2-rSrPyCkfjg3fpJrnZ1_Tub_qR_n2Ud_sa18259H29MkhOAqDkPysgayEzxnIM/s1600/comments.png) no-repeat;
width:32px;
height:32px;
text-align:center;
font-size: 16px;
float: right;
padding-top: 3px;
margin-right: 10px;
font-color: #ffffff;
}
.comment-ballon a{
color: #000000;
}

5. Cari kode berikut dengan cara Ctrl + F(find):
<a expr:name='data:post.id'/>
biasanya ada 2 code sejenis,pilih yang pertama

6. Jika sudah ketemu,letakkan code dibawah ini tepat diatasnya
<div class='comment-ballon'><b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <b:else/><data:post.numComments/> </b:if></a>
</b:if></div>
Jangan buru-buru di Save,klik "Preview/Pratinjau" terlebih dahulu. Gimana hasilnya? Sudah muncul belum jumlah komentar disamping Judul Postingan?
Jika sudah muncul,itu artinya kerja kita hampir selesai.
Perhatikan dibawah postingan juga masih muncul jumlah komentar gak?
Coba lihat gambar berikut:


7. Untuk menghilangkan Jumlah komentar dibawah postingan,cari kode berikut lalu HAPUS kode tsb:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

SELAMAT BERKREASI....

Tidak ada komentar:

Posting Komentar