Memasang Komen Buble Setelah Judul Postingan 6

Templete yang menarik akan memberberikan daya tarik tersendiri bagi pengunjung blog kita untuk membaca isi blog kita dan kembali berkunjung ke blog kita.Selain isi blog yang berkualitas tampilan templete juga akan sangat berpengaruh untuk menambah traffic ke blog kita, banyak cara yang bisa kita lakukan untuk mempercantik tampilan blog salah satunya yaitu dengan Memasang Komen Buble Setelah Judul Postingan.Dengan trik ini pemilik blog dan para pengunjung blog dapat mengetahui seberapa banyak pembaca blog yang telah memberikan komentar pada setiap postingan.Trik yang akan saya buat saat ini akan menampilkan komen buble dengan jumlah pemberi komentar setelah judul postingan blog di setiap postingan.Dibawah ini beberapa contoh Commen Buble icon Ynag bisa anda download.


Contoh comment Buble icon :

Dan adapun langkah-langkah Memasang Komen Buble Setelah Judul Postingan adalah:

1. Pergi ke blogger dasbor >>> Pilih opsi lainya >>> Templete >>>Back Up Dulu templete anda.

2. Selanjutnya Klik Edit HTML dan Centang kotak kecil Expand Widget Templates.

3. Cari kode ]]></b:skin> ini gunakan Ctrl+f atau F3 untuk memudahkan Pencarian.

4. Copy Kode di bawah ini dan pastekan di atas kode ]]></b:skin> tadi.

.comment-bubble {
float : right;
width : 48px;
height : 48px;
background : url(http://bambang-file1.googlecode.com/files/speech_bubble.png);
background-repeat: no-repeat;
background-repeat: no-repeat;
font-size : 18px;
margin-top : -15px;
margin-right : 2px;
text-align : center;
}

Keteranga:
Kode yang berwarna biru di atas bisa anda ganti dengan URL comment buble icon yang anda inginkan (milik anda).

5. Selanjutnya cari kode di bawah ini gunakan Ctrl+F atau F3 untuk memudahkan Pencarian.

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>

Atau

<b:if cond='data:post.title'>
      <h3 class='post-title entry-title' itemprop='name'>

6. Setelah anda menemukan salah satu dari kode diatas.tambahkan kode di bawah ini tepat dibawah salah satu kode diatas tadi.

<b:if cond='data:post.allowComments'>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='color: #ffffff; font-size: 18px; font-weight: bold;'><data:post.numComments/></a>
</b:if>

7. Kode Style yang berwarna hijau pada no 6 adalah kode yang bisa anda edit dan sesuaikan sesuai dengan keinginan anda.

8.Langkah terakhir Prevew templete anda jika semuanya oke simpan templete anda.

Selesai dan semoga bermanfaat.