16 December 2011

Cara Membuat Jumlah Komentar Disamping Judul Posting

Do you want to share?

Do you like this story?

Pada edisi kali ini(chailah bahasanya :)) Blog Informasi Online akan mencoba menulis Tutorial yang masih berhubungan dengan Komentar Blog. Apakah itu? Yap...benar! Kali ini kita akan mengotak-atik Cara Membuat Jumlah Komentar Disamping Judul Posting. Sebenarnya link jumlah komentar berada disamping judul postingan,dibawah judul posting maupun berada dibawah postingan itu sah-sah saja,tergantung selera Blogger masing-masing. Di Artikel ini Admin hanya berkreasi untuk mempercanting template blog.


Gak usah panjang lebar,jika sobat ingin mencoba menerapkan Tutorial ini,silahkan ikuti Langkah-langkah berikut:

1. Login di Blogger.com
2. Klik Template > Edit HTML > Lanjutkan
3. Jangan lupa centang Expand Template Widget
4. Cari code ]]></b:skin> ,letakkan CSS berikut tepat diatasnya
.comment-ballon{
background: url(http://2.bp.blogspot.com/-z4elotdbc6w/TueehEY4zLI/AAAAAAAAAyk/dPs5ZheGmEA/s1600/comments.png) no-repeat;
width:32px;
height:32px;
text-align:center;
font-size: 16px;
float: right;
padding-top: 3px;
margin-right: 10px;
font-color: #ffffff;
}
.comment-ballon a{
color: #000000;
}

5. Cari kode berikut dengan cara Ctrl + F:
<a expr:name='data:post.id'/>
biasanya ada 2 code sejenis,pilih yang pertama

6. Jika sudah ketemu,letakkan code dibawah ini tepat diatasnya
<div class='comment-ballon'><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'>1 <b:else/><data:post.numComments/> </b:if></a>
</b:if></div>
Jangan buru-buru di Save,klik "Preview/Pratinjau" terlebih dahulu. Gimana hasilnya? Sudah muncul belum jumlah komentar disamping Judul Postingan?
Jika sudah muncul,itu artinya kerja kita hampir selesai.
Perhatikan dibawah postingan juga masih muncul jumlah komentar gak?
Coba lihat gambar berikut:


7. Untuk menghilangkan Jumlah komentar dibawah postingan,cari kode berikut lalu HAPUS kode tsb:
<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'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

SELAMAT BERKREASI....

ARTIKEL TERKAIT :

16 komentar :

  1. sukses bro, tq tutorialnya.
    tolong kunjungan balik, skalian tukaran link, blog anda sudah saya pasang, silahkan di cek www.bobolbandar.com

    ReplyDelete
  2. @Coretan Pemula
    O.K....sip dech,lanjutkan kreasimu mas bro :)

    ReplyDelete
  3. Mantap nih gan...udah berhasil...akhirnya dapat disini cara menghilangkan komentar yang satunya lagi.Thanks ya gan :)

    ReplyDelete
  4. wah maksih yah udah sahare gan :)
    tutorial yg sangat bermanfaat :)

    ReplyDelete
  5. agar tampil dibawah judul post nama author. jam dan jumlah komentar tau gk om?!

    ReplyDelete
  6. @Download Anime Komik Bahasa Indonesia | Batuahku
    Coba ikuti langkah-langkah berikut sob:
    1.Setelah msuk di Dashboard -> Edit HTML
    2.Centang Expand Template Widget
    3.Cari sode:
    <div class='post-footer'>
    <div class='post-footer-line post-footer-line-1'>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='post-share-buttons'>
    <b:include data='post' name='shareButtons'/>
    </div>
    </b:if>
    4.Setelah ketemu,didawah kode tsb akan ada code-code spt ini:
    <span class='post-author vcard'>
    <b:if cond='data:top.showAuthor'>
    <data:top.authorLabel/>
    <span class='fn'><data:post.author/></span>
    </b:if>
    </span>


    <span class='post-timestamp'>
    <b:if cond='data:top.showTimestamp'>
    <data:top.timestampLabel/>
    <b:if cond='data:post.url'>
    <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
    </b:if>
    </b:if>
    </span>


    <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'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
    </b:if>
    </b:if>
    </span>

    5.Kalau dah ketemu hapus ke-3 code tsb
    6.Cari Kode:
    <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
    <b:if cond='data:post.url'>
    <a expr:href='data:post.url'><data:post.title/></a>
    <b:else/>
    <data:post.title/>
    </b:if>
    </b:if>
    </h3>
    </b:if>

    7.Jika dah ketemu letakkan kode ini dibawahnya:
    <b:if cond='data:top.showTimestamp'><img src='http://1.bp.blogspot.com/-74MEh_0ickA/T-d8UFy2OyI/AAAAAAAAAOU/2XxT9r9KVjQ/s1600/calendar.png' style='border:none;'/> <data:post.timestamp/></b:if>

    <b:if cond='data:top.showAuthor'><img src='http://2.bp.blogspot.com/-QJmIBm-69e4/T-d8attKMbI/AAAAAAAAAO8/xLFSZIspVz8/s1600/user.png' style='border:none;'/>Written by: <a href='http://www.blogger.com/profile/NOMOR ID BLOGGER SOBAT'><data:post.author/></a></b:if>

    <img src='http://4.bp.blogspot.com/-EZzqZGQx4Fw/T-d8Xj2TVqI/AAAAAAAAAOs/vvR1Wk4JVQg/s1600/comment.png' style='border:none;'/>Comments: <b:if cond='data:post.allowComments'><a class='comment-bubble' expr:href='data:post.url + &quot;#comments&quot;' expr:title='&quot;Comments to &amp;quot;&quot; + data:post.title + &quot;&amp;quot;&quot;'><data:post.numComments/></a></b:if>

    8.Save
    NOTE:
    Jika sobat bingung coba kita chat langsung saja via YM atau FB

    ReplyDelete
  7. thnks atas artikelnya ya,,,salam kenal serta salam persahabatan juga.

    ReplyDelete
  8. Thank's gan atas tutorialnya, cara diatas udah ane terapkan di blog.

    ReplyDelete
  9. mantap mas bro tipsnya tutorialnya

    ReplyDelete
  10. terimakasih gan atas infonya salam kenal yah gan
    maaf gan numpang promonya yah
    rajalistrik.com ialah toko online kami yang menjual produk-produk teknik industri terbesar, terlengkap, termurah, dan terpercaya di Indonesia yang menawarkan lebih dari 200.000 item produk dari kurang lebih 200 merek. rajalistrik.com berupaya memudahkan Anda untuk mendapatkan produk-produk teknik yang Anda inginkan dengan jaminan orisinalitas, kemudahan bertransaksi, kecepatan pengiriman, dan harga yang kompetitif.http://rajalistrik.com/

    ReplyDelete
    Replies
    1. yAP Sama2 mbak Ruska Aulia, salam sukses slalu untuk Anda :-d

      Delete
SILAHKAN TULIS KOMENTAR ANDA, DENGAN CATATAN :
* Komentator "Anonymous" tidak diprioritas-kan, jadi gunakan salah satu Profile untuk respon lebih cepat
* Jika anda tidak memiliki akun Google anda bisa gunakan Name/URL
   - isi Name dengan Nama Anda
   - isi URL dengan link/url profile Facebook Anda atau Twitter Anda atau yang lainnya
* Mohon jangan menyisipkan Link Hidup..!!!
* Please do not insert Live Links ....!!!

Advertisements

Advertisements

 

Cara Membuat Jumlah Komentar Disamping Judul Posting Oops ! | Error 404