Untuk mendapatkan space iklan dihalaman ini silahkan hubungi owner Blog Design, Kami akan secepatnya merespon dan mempertimbangkan letak dari iklan text dan banner anda...

Sunday, July 28, 2013

cara membuat counter comment diblog

Counter comment ini dapat memberikan kesan profesional pada comment content halaman blog anda, tampilan yang unik membuat kepuasan design tersendiri buat pengguna blog. Counter comment ini berdigit decimal dan terpasang pada comment content halaman blog. Counter comment ini akan menampilkan nomer komentar yang telah dipublish. Disamping membuat halaman anda unik terutama bagian kotak komentar, Counter comment ini juga akan membedakan jenis replay dan komentar baru dengan menampilkan angka angka yang berbeda. Sistem pengoperasian dari Counter comment ini hanya di edit pada bagian CSS tanpa mempengaruhi loading halaman blog kesayangan anda. Counter Comment ini masih berfungsi sangat stabil pada komentar sistem Thread. Untuk sistem comment single seperti form komentar facebook hal ini tidak begitu maksimal. Oke dari pada nunggu lama ngak sabaran mari langsung saja menuju TKP. Untuk DEMO silahkan kunjungi :
http://themsseo001.blogspot.com/2013/07/tersedia-fitur-untuk-iklan-anda.html


Install Program CSS


  1. Login ke dashboard anda
  2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
  3. Cari code ]]></b:skin> 
  4. Copy Code script CSS dibawah ini, pastekan diatas code ]]></b:skin> tadi

.comment-thread ol {
counter-reset: countcomments;
}
.comment-thread li:before {
content: counter(countcomments,decimal);
counter-increment: countcomments;
float: right;
font-size: 22px;
color: #FFA6A4;
padding-right: 30px;
padding-top: 26px;
margin-top: 10px;
margin-left: 24px;
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
counter-increment: contrebasse;
float: right;
font-size: 18px;
color: #8A8A84;
padding-left: 1px;margin-right:-15px;
padding-top: 15px;
}

Keterangan Code
  • Tulisan kode warna MERAH adalah tataletak counter commentnya, silahkan anda edit sesuai dengan tata letak komentar halaman blog anda.
  • Tulisan warna BIRU adalah ukuran besar kecilnya angka pada counter comment.
  • Tulisan kode warna HIJAU adalah warna dari counter comment tersebut.
  • Bila anda ingin lebih berkreasi silahkan anda edit CSSnya untuk menyesuaikan tampilan related post ini dengan tems template anda.

Kesimpulan

Counter comment ini memberikan keunikan tersendiri pada halaman blog dan menghitung atau membedakan comment sistem replay atau baru. Counter comment ini dapat dipasang pada blog HTML5 dan CSS3, CSS ringan sehingga tidak mempengaruhi loading blog. Counter comment ini berfungsi maksimal pada sistem Thread Comment.

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Me

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter
Di posting oleh : Rivai Silaban Update pada : 10:52 AM

25 comments :

  1. mas rifai mau naya nih , maaf agak melenceng dari topik
    mas kalau mau mengatasi
    We found too many H2 & H3 Tags
    di seo analyzer itu gi mana ya mas ...

    tadi sih punya saya gak ada kesalahan gitu , tapi tiba-tiba saya chek lagi malah ada ,,

    salam dari ahmadsuyadi.blogspot.com

    ReplyDelete
  2. udah gpp...
    H2 sudah pasti dimiliki halaman blog hanya yang hilang biasanya tag H3, kemarin widget yang kamu ganti menjadi H5 kan bukan semua widgetnya, nah sekarang coba ganti widget yang lainnya menjadi H3 bukan H2. Jadi untuk widgetnya silahkan kamu ganti dengan memakai tag H3 dan H5 saja, untuk tag title pada post silahkan buat tag H2

    semoga bermanfaat sob.

    ReplyDelete
  3. trima kasih mas rifai
    sudah berhasil , semoga Allah membalas kebaikan mas rivai ..

    oh ya , mas tadi h2 nya itu tidak di ganti dengan h3 tapi di ganti dengan h4 atau h5 mas ....
    soalnya h2 itu masih sekolompok h3

    tadi waktu saya ganti h2 dengan h3 malah tambah error , setelah saya berfikir dan kemudian mengganti h2 dengan h4 akhirnya berhasil mas

    sekali lagi trima kasih mas.

    ReplyDelete
  4. amin. makasih sob..
    oh gitu ya baguslah kalo sudah berhasil..

    ReplyDelete
  5. mas rivai,sy msh newby bgt n msh otak-atik blog biar tampilannya bagus,tapi saya bingung mas,setiap di minta konfirmasi alamat url ko punya saya selalu ga valid ya?padahal klo saya cari di google search punya saya terlacak ko..mohon bantuannyaa mas.makasih...

    ReplyDelete
  6. konfirmasi url untuk pendaftaran atau apa ini mba kurang paham saya. apa mba blom daftar ke webmaster tool maksudnya ?

    ReplyDelete
  7. Di template saya (AndroKompi)(lapak baru)nggak bekerja,Master.

    Kenapa ya, apa karena crash sama comment setting lainnya ya?

    ReplyDelete
    Replies
    1. crashnya tidak terlalu mempengaruhinya tapi saya melihat tag html ANDRO KOMPI itu sudah dimodivaikasi, jadi sistem comment-thread nya sudah dimodivikasi tidak memakai code ( ol & li ).

      Tapi untuk solusinya coba cek bagian ( comment-thread )mana tau ada code ( display:none ) dibagian code tersebut sehingga menghilangkan sistem ( comment-thread ) tidak berpungsi ol dan li.

      Delete
  8. Oh ya Master, Out of Topic neh, kalau ingin, sehabis visitor publishing comment, terus page kita melakukan Auto-Scroll Down, gimana caranya Master?

    ReplyDelete
    Replies
    1. ini memang sudah sering dipertanyakan para sobat kita yang lain, tapi dari semua pengalaman yang pernah saya alami, hal yang mengakibatkan tidak berfungsinya form comment auto scroll down itu disebabkan scripnya, bila kita merombak scriptnya akan banyak mempengaruhi terhadap fungsi comment itu sendiri,
      Tapi itu tidak terlalu berpengaruh lah sob, tapi bila ingin tetap merubahnya silahkan tukar semua script JS commentnya terhadap script JS comment bawaan blogspot sob.

      Delete
  9. Wow tanya jawab yang bermanfaat nyimak saja
    Saya Bang Rivai, soal nya saya masih mumet
    Dengan pesan coment, hhh yang sampai ni hari
    belum kelar juga, sampai pusing mikir nya hhhhh

    ReplyDelete
    Replies
    1. sebenarnya yang sudah saya jelasin itu sudah detail kali bang, hanya saja abang masih belum terbiasa saja, ntar juga jadi bisa..

      Delete
  10. Iyah kaya lumayan rumit, padahal
    belajar saya pada bagian yang lain
    walau sulit, tapi mudah di peljari namun untuk
    Pesan comments punya Bang Rivai lumayan rumit nya
    Nanti kapan2 coba lagi Bang.trima kasih

    ReplyDelete
  11. bang, saya mau tanya. kenapa tiba2 di tiap avatar komen blog saya ada angkanya ya? itu tiba2 aja kayak gitu padahal gak ada edit apa. mohon dibbales ya bang :(

    ReplyDelete
    Replies
    1. 1 lagi bang, antara nama orang yang komen sama tanggal komennya kenapa gak ada spasi ya? cara benerinnya gimana? bisa mohon di cek keblog saya bang . mohon bantuannya. cari digoogle gak nemu

      Delete
    2. bang, saya mau tanya. kenapa tiba2 di tiap avatar komen blog saya ada angkanya ya? itu tiba2 aja kayak gitu padahal gak ada edit apa. mohon dibbales ya bang :(

      Replay
      heheh gitu ya...
      memang server google lagi di perbaharui codenya menjadi lebih baru, jadi ada efek yang ditimbulkan buat beberapa situs tapi untuk mencegah hal tersebut coba lihat bagian CSS commentnya yang kode ul atau li atau ol lihat saja di CSSnya terus lihat kode " list-style-type " didalam kode ul, li nya bila tidak ada tambahkan kode " list-style-type: none; " kedalam koe CSS ul dan linya.

      Delete
    3. 1 lagi bang, antara nama orang yang komen sama tanggal komennya kenapa gak ada spasi ya? cara benerinnya gimana? bisa mohon di cek keblog saya bang . mohon bantuannya. cari digoogle gak nemu

      coba kamu cari kode " user " atau " autor-blog " atau " date-time " yang penting kode mengenai nama comentator atau tanggalnya, di CSSnya setelah ketemu lihat bagian CSS tersebut " margin " untuk merubah jarak atas - bawah, kiri - kanan silahkan buat kode " margin : 0 10px; " arti kode tersebut adalah memiliki jarak atas bawah adalah 0 dan jarak kiri dan kanan adalah 10px, semoga dapat membantu kamu sob..

      salam bloger..
      thx atas kunjungannya..

      Delete
    4. dari cara2 yang mas kasi, beberapa aja yang saya temukan itupun saya bingung mau ngeditnya bagaimana mas. Atau mas tau solusi gimana cara menata ulang kotak komentar?

      Delete
    5. oya heheh saya paling bingung mas sebab saya juga tidak tau blognya yang mane hehehhe..

      coba lihat tutorial ini..

      http://rivai-silaban.blogspot.com/2013/07/cara-membuat-thread-comment-seo-friendly.html

      Delete
    6. ini mas http://www.yogashena.com hehe maaf kalo harus nulis. bisa coba dilihat bagian komentar. hancur :|

      Delete
    7. sabar saja ntar juga cantik kok, rajin blajarnya sob...
      oya blognya berat sob, kurangin dikit bebannya biar mantap..

      Delete
    8. haha iya mas agak banyak yang bikin berat. suka aja soalnya :D terimakasih bimbingannya mas. sekarang form komentar saya sudah keren. hehe. semua masalah awal teratasi.

      Delete
    9. okelah tetap semangat,
      salam bravo

      Delete
  12. Thanks pencerahannya Gan.

    Coba cek yang ini Gan healthyormoney.blogspot.com

    ReplyDelete

1. Komentar SPAM Akan secepatnya dihapus
2. Pastikan untuk " Berlangganan Lewat Email " untuk membangun kreatifitas blog ini
3. Cek komentar masuk sebelum bertanya.
4. Link aktiv tidak akan berpungsi.
5. Dilarang menyebarluaskan artikel tanpa persetujuan dari saya.
6. Untuk mengajukan pertanyaan diluar postingan diatas, silahkan klik " Forum Diskusi "
7. Bergabung dengan kami untuk menjadi member Klik " Join to Member "
8. Komentar yang mengandung code tag HTML, konversikan terlebih dulu silahkan klik " Konversi Kode "

Salam bloger .. !!
Pergunakan semua fasilitas di Blog ini untuk mempermudah anda..
Konversi Kode Forum Diskusi Join to Blog