MENAMPILKAN JUMLAH KOMENTAR DAN TANGGAL POSTING PADA HARI YANG SAMA

Pertama saya ucapkan terima kasih kepada Kang Salman dari negeri anta berantah atas tutorialnya tentang menampilkan tanggal posting di hari yang sama. Namun, kali ini saya modifikasi sedikit tutorial tersebut dengan menambahkan icon dan jumlah komentar pada tiap postingan -dalam hal ini tampilan postingan di home page dan tampilan postingan penuh-. Sehingga judulnya pun saya ubah menjadi Cara Menampilkan Jumlah Komnetar dan Tanggal Posting pada Hari yang Sama. Mungkin tampilannya -menurut saya- agak sedikit menarik dan lebih elegan. Contohnya dapat dilihat pada gambar di bawah ini :

Berikut Cara Menampilkan Jumlah Komentar dan Tanggal Posting Pada hari yang Sama :

• Login ke akun blogger anda
• Klik Template > Edit HTML centang pada Expand Template Widget
• Cari kode ]]></b:skin> , setelah itu, letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

.comments-area {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFRv8WRxIf6yjv_XGon4opkHcdC8oYjbiLUd-57cRTrurCj8ggr5N6t6c1a5WrQ0aYhh2tem53XXY5OLLkwCPy9aziSuHGK6kJI3fNgMHewFyqiSrKeu5hqaVsodg67quvsbkafKzGjnrj/s1600/comment.png) no-repeat center right;margin:0 0 0 5px;padding:0 15px 0 0;}

• Kemudian cari kode berikut:

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

•  Selanjutnya kalau sudah ketemu hapus dan ganti dengan yang baru ini :

<b:if cond='data:post.dateHeader'>
<script>var ultimaFecha = &#39;<data:post.dateHeader/>&#39;;</script>
<h2 class='date-header'><data:post.dateHeader/><span class='comments-area'><data:post.numComments/><b:if cond='data:post.numComments == 0'> <data:top.commentLabel/><b:else/><data:top.commentLabelPlural/>  </b:if>
</span></h2>
<b:else/>
<h2 class='date-header'>
<script>document.write(ultimaFecha);</script><span class='comments-area'><data:post.numComments/><b:if cond='data:post.numComments == 0'> <data:top.commentLabel/><b:else/><data:top.commentLabelPlural/>  </b:if>
</span></h2> </b:if>

Bagi yang menggunakan template dari Creating Website (maskolis) cari kode di bawah ini:

<div class='post-header'>
    <div class='post-header-line-1'/>
    </div>

Lalu kopi paste script diatas tepat di bawah kode yang anda cari tadi, sehingga hasilnya seperti di bawah ini:

<div class='post-header'>
    <div class='post-header-line-1'/>
    </div>
<b:if cond='data:post.dateHeader'>
<script>var ultimaFecha = &#39;<data:post.dateHeader/>&#39;;</script>
<h2 class='date-header'><data:post.dateHeader/><span class='comments-area'><data:post.numComments/><b:if cond='data:post.numComments == 0'> <data:top.commentLabel/><b:else/><data:top.commentLabelPlural/>  </b:if>
</span></h2>
<b:else/>
<h2 class='date-header'>
<script>document.write(ultimaFecha);</script><span class='comments-area'><data:post.numComments/><b:if cond='data:post.numComments == 0'> <data:top.commentLabel/><b:else/><data:top.commentLabelPlural/>  </b:if>
</span></h2> </b:if>

Jika sudah selesai, jangan lupa preview dulu untuk jaga-jaga apa scriptnya error atau tidak. Setelah anda benar-benar yakin dan berhasil barulah disimpan.

Perhatian: Jika penerapan cara pertama sudah sukses di blog anda, tidak perlu lagi ke cara yang kedua. Kebanyakan template menggunakan kode standar, jadi alangkah indahnya anda tetap fokus pada cara yang pertama.

Semoga tutorial ini bermanfaat. terima kasih telah berkunjung.