Bagaimana untuk menambah nombor terhadap semua komen-komen di blog anda. Dan setiap nombor akan dihubungkan dengan ulasan yang unik. Anda / pembaca anda boleh menggunakan nombor dan link yang berkaitan dengan menyebutkan atau titik tertentu komen pada setiap posting anda. Ini membuatkan bahagian tersebut tidak terlalu kosong, dan sesungguhnya amat menarik.
Anda boleh lihat contoh dibawah, tetapi saya, semasa membuat posting ini dan kerana perjalanan laman ini terlalu baru, saya terpaksa menggunakan komen sendiri bagi menguji keberkesanannya. Lalu saya snap photo untuk tontonan anda. Saya harap anda menyukainya.
mencuba bagaimana ia berfungsi. Lihat pada bahagian komen.
Sekiranya anda inginkan pada laman anda, ikutilah langkah mudah yang saya ingin kongsikan dibawah.
Langkah Pertama:
Login to blogger, Seperti biasa, pergi ke 'Blog Layout', kemudian klik tab 'Edit HTML'. Kemudian tandakan kotak 'Expand Widget Template'. Sekiranya anda tidak menanda didalam kotak ini, anda tidaka akan menemui apa yang ingin kita cari didalamnya, Menandakan kotak ini, umpama kita menghurai keluar segala isi didalamnya.
Langkah berikutnya,
Pada ruang kod template layout, tekan key CTRL+F, untuk mencari perkataan
<b:loop values='data:post.comments' var='comment'>
Salin kod dibawah ini, kemudian tampalkan sebelum atau diatas perkataan yang kita cari sebentar tadi.
<script type='text/javascript'>var CommentsCounter=0;</script> <!--COMM-NUM-STARTS-->
Lihat contoh gambar dibawah.
<data:commentPostedByMsg/>
Kemudian salin kod dibawah ini, kemudian tampalkan selepas atau dibawah kod yang dicari sebentar tadi.
Lihat contoh gambar dibawah.
<!--COMM-NUM-STARTS-->
<span class='comm-num'>
<a expr:href='data:comment.url' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
<!--COMMNUM-STOPS-->
Untuk sementara, anda boleh meyimpan kod yang telah ditampalkan, klik butang 'Save Template' untuk menyimpan kod tersebut.
Opsss..tunggu dulu, proses ini belum siap sepenuhnya.
Sekarang kita cari kod dibawah. Tekan key CTRL+F, untuk mencari kod ini. </head>.
Kemudian salin kod dibawah ini, dan tampalkan sebelum atau diatas kod </head> tadi.
Anda boleh lihat pada gambar bagaimana dan dimana harus anda tampal kod dibawah ini.
<!--COMM-NUM-STARTS-->
<style type="text/css">
.comm-num a:link, .comm-num a:visited {
color: #FF0000 !important;
text-decoration: none !important;
background: url(http://i50.tinypic.com/egx3t3.jpg) no-repeat;
width: 50px;
height: 48px;
float: right;
display: block;
margin-right: 5px;
margin-top: -15px; /*comments-counter position*/
text-align: center;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 15px;
font-weight: normal;
}
.comm-num a:hover, .comm-num a:active {
color: #000000 !important;
text-decoration: none !important;
}
</style>
<!--COMM-NUM-STOPS-http://spelek-blogger.blogspot.com-->
Anda boleh tukar url link image untuk mengantikan gamabr, lihat kod yang bertulisan merah diatas, anda juga boleh menukar saiz lebar dan lebar gambar tersebut.
Untuk menukar warna tulisan, anda boleh edit pada tulisan yang berwarna biru, pada bahagian atas, warna bagi paparan lalai, manakala dibahagian bawah pula semasa mouse hover.
Anda boleh dapatkan disini bagi menukar ikon gambar, Terima kasih kepada Divya Sai untuk link tersebut. Anda juga boleh menggunakan ikon anda sendiri, sekiranya anda muat naik ikon tersebut kemana-mana url image hosting dan tetapi anda harus menyebutkan dimensi yang benar (lebar dan tinggi) untuk penempatan nombor yang betul pada gambar.
(Right-Click and select "Copy Image Address/Location"):
Setelah semua selesai, klik butang 'Save Template' untuk menyimpan.
Anda boleh klik tajuk utama posting anda, Lakukan percubaan komen anda untuk melihatnya, sekiranya tanpa sebarang komen anda tidak mungkin dapat melihatnya.
Selamat mencuba.
:)
No comments:
Post a Comment