Sabtu, 20 Maret 2010

Mempercantik Bagian Komentar di Blog

Merubah tampilan widget itu sudah biasa dilakukan para blogger,tetapi kalau Mempercantik Bagian Komentar di Blog adalah hal yang jarang dilakukan oleh para blogger.Karena banyak blogger yang tidak mempedulikan bagian di kotak komentar.Padahal kalau kita mau merubah tampilan kotak komentar itu sangat mudah sekali dan tentunya sangat menarik dan berguna buat Para blogger Sejati apalagi para master SEO.mari langsung saja ke TKP....

Merubah tampilan lewat Elemen Halaman
1.Login di Blogger.com
 2.Masuk di Tab"Tata Letak". dan Pilih

Tampilan Elemen Halaman















3.Anda akan menemui tampilan ini

Tampilan yang Harus Diperhataikan






















Anda bisa mengganti Kata"Komentar" yang diberi tanda Merah sesuai kesukaan anda,Seperti:
1. Komentar Terbaik
2. Saran dan Kritik
3. Pendapat Pengunjung
4. Orang Berpendapat
5. Orang Berbicara
6. dll (dan lainnya lupa)

4.Lalu Pilih Tombol




Merubah tampilan lewat HTML
Merubah tampilan lewat HTML memang cara yang sangat Manjur buat para blogger oleh karena itu langsung saja masuk ke halaman "Edit HTML"
Tab Blogger







1. Cari Kode
<span class='post-comment-link'>

"Kalau Tidak ada Cari saja Kode ini"
comment-link'>

2.Kalau sudah ketemu Perhatikan Kode dibawah ini:
    <span class='post-comment-link'>
          <b:if cond='data:blog.pageType != &quot;item&quot;'>
            <b:if cond='data:post.allowComments'>
              <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>Berkomentarlah...<b:if cond='data:post.numComments == 1'>,&#160;1 <data:top.commentLabel/><b:else/>,&#160;<data:post.numComments/> <data:top.commentLabelPlural/></b:if>Sejauh ini</a>
            </b:if>
          </b:if>
        </span>

Ganti kode berwarna Kuning sesuai kesukaan anda,script diatas akan tampil seperti ini:

Berkomentarlah...5 Orang Berpendapat Sejauh ini

Belum Bosankan dengan Tips ini? Kalau belum aku ajak lagi dengan menambahkan icon calloutsseperti ini:








Kodenya akan seperti ini saja;

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>,&#160;1 <data:top.commentLabel/><b:else/>,&#160;<data:post.numComments/> <data:top.commentLabelPlural/>
</b:if></a><img src='http://i989.photobucket.com/albums/af13/vikost/th_Bahtiarkomentaricon.png' style='border:0px'/>
</b:if>
</b:if>
</span>


Kode di atas akan menampilkan icon itu di bagian akhir,jika ingin menempatkan icon di bagian awal,maka kode yang harus anda ubah adalah kode ini:
<img src='http://i989.photobucket.com/albums/af13/vikost/th_Bahtiarkomentaricon.png' style='border:0px'/>

Diletakan setelah kode

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

Jika anda tidak suka dengan icon di atas anda bisa mengubahnya dengan cara mengganti url icon yang ini

http://i989.photobucket.com/albums/af13/vikost/th_Bahtiarkomentaricon.png


dengan url icon anda.
Jika anda ingin mempercantik lagi anda juga bisa menambahkan Pesan ketika link comment disorot.Dengan cara menambahkan kode dibawah ini setelah kode expr:onclick='data:post.addCommentOnclick'>


title="Ganti dengan Pesan Anda"

Bila anda sudah puas,.....lalu klik Tombol





Kalau belum Puas!!!!Puas.....puasin saja ya.!!!....saya sudah lelah..hehehehe[KangTiar]

22 komentar:

  1. Wah Apik tutornya kangMas... Salam kenal yo

    BalasHapus
  2. :a: Baru ini keren . . jadi lebih wah . . Trims kk . . .

    BalasHapus
  3. jalan-jalan sore hari, jumpa tempat tongkrongan di sini, sekalian nambah ilmu membaca artikel Tips Blognya, teriamakasih ya.
    Nice blog !!! (balas kunjungannya ya)

    BalasHapus
  4. wow boleh tuh tutorialnya kunjungi balik ya..

    BalasHapus
  5. @heksawati
    ya sama-sama
    ,terima kasihjuga telah mengunjungi blog kami

    BalasHapus
  6. Bagaimana caranya kalai pakai word press??

    BalasHapus
  7. kalau boleh jujur, sebenernya bingung baca tutornya mas.... tapi coba di puas-puasin deh...

    BalasHapus
  8. Wuahh keren banget om.. ijin mencoba

    BalasHapus
  9. Ini yang saya cari-cari bro bagus nih . .
    ,, drimu udh aQ follow skelian follow back aQ ea uqe !!
    hhe. .

    http://bomexx.blogspot.com/

    BalasHapus
  10. makasih gan udah berbagiilmunya .
    nice

    BalasHapus
  11. Nice, siap dicoba mumpung masih polos tempet ane.. hehehe

    BalasHapus