Tampilan Jumlah Komentar Diatas Posting

Tampilan Jumlah Komentar Diatas Posting ini dengan kode CSS3.
Gak sulit kok.. hanya tinggal mengikuti tutorial dibawah ini saja yang saya dapat dari Forum:

1.       Login ke dashboard blogger anda, pilih Rancangan > Edit HTML, centang Expand widget template.

2.       Cari kode ]]></b:skin>  pada template anda.

3.       Letakkan kode CSS3 dibawah ini diatas kode ]]></b:skin>.

a.comment-bubble:hover{color:#cc6611;}

a.comment-bubble {

float:right;

width:34px;

height:18px;

text-align: center;

white-space:nowrap;

font: bold 14px monospace;

color:white;

position:relative;

margin-left: 6px;

margin-top: 3px;

padding-top:2px;

background:#eeaa00;   /* fallback */

background:-webkit-gradient(linear, 0 0, 0 100%, from(#f8dd99), to(#eeaa00));

background:-webkit-linear-gradient(#f8dd99, #eeaa00);

background:-moz-linear-gradient(#f8dd99, #eeaa00);

background:-o-linear-gradient(#f8dd99, #eeaa00);

background:linear-gradient(#f8dd99, #eeaa00);

-webkit-border-radius:6px;

-moz-border-radius:6px;

border-radius:6px;

border: 1px solid #dd8808;

border-bottom-color: #f8dd99;

border-right-color: #f8dd99;

}

a.comment-bubble:after {

content:"";

position:absolute;

bottom:-5px;

left:11px;

border-width:5px 5px 0px 0px;

border-style:solid;

border-color:#eeaa00 transparent;

display:block;

width:0;

}

4.       Kemudian cari kode judul artikel/posting pada template anda karena kita kita akan meletakkan kode untuk menampilkan jumlah komentar ini disebelahnya. Susunan kode tag judul biasanya seperti ini.

<b:includable id='post' var='post'>

  <div class='post hentry'>

    <a expr:name='data:post.id'/>

    <b:if cond='data:post.title'>

      <h3 class='post-title entry-title'>

NB: Sesuaikan kode tag heading (h3) dengan tag judul post yang ada di template anda. Karena bisa jadi dalam template anda tag judul adalah h1 atau bisa juga h3.

5.       Tambahkan tag HTML yang berwarna merah berikut ini dibawahnya.

<b:includable id='post' var='post'>

  <div class='post hentry'>

    <a expr:name='data:post.id'/>

    <b:if cond='data:post.title'>

      <h3 class='post-title entry-title'>

<b:if cond='data:post.allowComments'><a class='comment-bubble' expr:href='data:post.url + &quot;#comments&quot;' expr:title='&quot;Comments to &amp;quot;&quot; + data:post.title + &quot;&amp;quot;&quot;'><data:post.numComments/></a></b:if>

6.       Save/Simpan template anda.

Selamat mencoba.!! Jika berhasil merubah tampilan jumlah komentar diatas posting Jangan lupa kasih komentar ya. karna saya pun belum mencoba merubah tampilan jumlah komentar diatas posting. hihihihi