Memasang 'Heart Comment Count'.

Heart Comment Count

1. Sign in akaun blogger.

2. Pilih LAYOUT --> EDIT HTML.

3. BACKUP TEMPLATE anda dahulu untuk mengelakkan sebarang masalah.

4. Klik pada EXPAND WIDGET TEMPLATE seperti screenshot di bawah ini.

Panduan Blogger

5. Cari kod ini.

]]></b:skin>

6. Copy kod di bawah dan letakkan di atas kod tadi.

.heart-comment-count{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGjEjO8yMyHELOP0WieEJ1YVE4ndjXE0HKJaTBoY7z8yxK5qLItjYmZ3-waBIpBy0KrkTpOLlXtWc1nYMuLxxfW-346QZRMTeo-aTP4QrO8DLaCLtphyG3K2hL7u6arYDBD28Z4sKwi2UH/s400/heart-gold-icon.png) no-repeat;
float:right;top:0;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
height:31px;
width:34px;
text-align:center;
margin-left:10px;
padding:6px 0 0 0;
}

Anda boleh memilih salah satu icon di bawah untuk digunakan.

Gantikan url icon yang berwarna merah.

01. Heart Pink.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsJwi0fuR-1YdEf-6wgk9-OgXQRwKU8ph0OJoq2PfBasRGcokSsYTqdQqnesETqZBK8vWD_hY4mA859x7yoowLeHZvVVPvb0stWnGI2RKL2Fhhda8Z5Y_eZIisijUARBA466tMbPReRGvD/s400/heart-pink-icon.png

02. Heart Gold.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGjEjO8yMyHELOP0WieEJ1YVE4ndjXE0HKJaTBoY7z8yxK5qLItjYmZ3-waBIpBy0KrkTpOLlXtWc1nYMuLxxfW-346QZRMTeo-aTP4QrO8DLaCLtphyG3K2hL7u6arYDBD28Z4sKwi2UH/s400/heart-gold-icon.png

7. Setelah selesai memilih icon.

8. Cari kod ini.

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

9. Copy kod dibawah dan letakkan diatas kod tadi.

<span class='heart-comment-count'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
</span>

10. Pilih PREVIEW untuk melihat hasilnya.

11. Sekiranya berpuas hati SAVE TEMPLATE.

Perhatian !!! Anda boleh mengubah kepada Comment Bubble dengan menggantikan url icon berwarna merah dan kod dibawah.

padding:3px 0 0 0;

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipg5Bpvowr3MvIVFQXsZL1Cw1EzYdy-nUYDn7KbbnS67-gzUsHz-HJc_HsndzQu3UwX96PmzeFCvw3-zdpfHkyf9wfqC1VwGhaoeK5YiI5DiKbTWaXo-erSqWtyNUFvcFCENNWwfr2VSVT/s400/comment-icon+2.png

12. Selamat Mencuba.

4 comments:

feto said...

pertamaxx gan...saya akan coba untuk blog saya...salam kenal...^_^

Zikri Husaini said...

thanks for the info..

kritis said...

gh

andry yudha said...

waahhh,, tambah meriah aja nih blog nanti kalau ditambahin ini,, , thanks gan

tapi kadang kadang kode yang dikasih gk bener semua,, ini dijamin yah,,

ok i wanna try it,,

Post a Comment