Memasang total post dan total comment

Javascript jQuery sitemap Trik

Mungkin ini bukan trik baru, tapi saya coba terapakan kembali sedikit trik lama ini untuk menambah keunikan di dalam tampilan blog saya. memasang total post dan total comment bukan hal yang sulit, karena kita hanya perlu menggunakan sedikit script. script yang di gunakan seperti di bawah ini:

Script untuk Total Posts

1code-line:1-12code-line:1-23code-line:1-34code-line:1-45code-line:1-56code-line:1-6<script style="text/javascript">
 function showpostcount(json) {
  document.write('<span>Total Posting : <b>' + parseInt(json.feed.openSearch$totalResults.$t,10) + '</b></span>');
}
</script>
<script src="http://domain-blog.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script>

Script untuk Total Comments

1code-line:2-12code-line:2-23code-line:2-34code-line:2-45code-line:2-56code-line:2-67code-line:2-7<script style="text/javascript">
 function numberOfComments(json) {
  document.write('<span>Total komentar : <b>' + json.feed.openSearch$totalResults.$t + '</b></span>');
 }
</script>
<script src="http://domain-blog.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script>

silahkan jangan lupa untuk mengubah nama domain-blog sesuai blog anda.

script di atas saya coba pasangkan di author box blogger, kurang lebih jadi seperti ini kode html dan scriptnya:

1code-line:3-12code-line:3-23code-line:3-34code-line:3-45code-line:3-56code-line:3-67code-line:3-78code-line:3-89code-line:3-910code-line:3-1011code-line:3-1112code-line:3-1213code-line:3-1314code-line:3-1415code-line:3-1516code-line:3-1617code-line:3-1718code-line:3-1819code-line:3-1920code-line:3-2021code-line:3-2122code-line:3-22<b:if cond='data:blog.pageType == "item"'> 
<div class=' admin-author'>
<h4>
Ditulis Oleh : <a expr:href='data:blog.homepageUrl'><data:post.author/></a> ~ Share and care</h4>
<div class='kontainer'>
<img height='70' src='https://lh6.googleusercontent.com/-PGirmW8eUT4/AAAAAAAAAAI/AAAAAAAAB-8/2nWmu20XYEQ/s120-c/photo.jpg' width='80'/> Anda sedang membaca sebuah artikel yang berjudul <b><a expr:href='data:post.url'><data:post.title/></a></b>, Semoga artikel tersebut bermanfaat untuk sobat. Jika ada pertanyaan, kritik, dan saran yang ingin di sampaikan silahkan tulis di kotak komentar  <p>
<script style="text/javascript">
 function showpostcount(json) {
  document.write('<span>Total Posting : <b>' + parseInt(json.feed.openSearch$totalResults.$t,10) + '</b></span>');
}
</script>
<script src="http://defandaky.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script> - <script style="text/javascript">
 function numberOfComments(json) {
  document.write('<span>Total komentar : <b>' + json.feed.openSearch$totalResults.$t + '</b></span>');
 }
</script>
<script src="http://defandaky.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script>
</p>
<div style='clear:both;'/>
</div>
</div>
</b:if>

untuk hasil dari kode di atas seperti di bawah ini:


Ditulis Oleh : ~ Share and care

Anda sedang membaca sebuah artikel yang berjudul , Semoga artikel tersebut bermanfaat untuk sobat. Jika ada pertanyaan, kritik, dan saran yang ingin di sampaikan silahkan tulis di kotak komentar
Total Posting : 258 - Total komentar : 827

silahkan sobat jika tertarik untuk di aplikasikan di mana saja dan di beri gaya tampilan sesukanya, semoga berguna...

Artikel Terkait

  • Cara membuat efek loading menggunakan ajax
    AJAX bukanlah bahasa pemrograman baru, tapi cara baru bagaimana menggunakan standar yang ada. AJAX adalah seni bertukar data dengan server, dan memperbarui bagian-bagian dari suatu halaman web - tanpa reload seluruh halaman. AJAX dibuat pada tahun 2005 oleh Google, dengan Google Suggest. Google Suggest menggunakan AJAX untuk membuat antarmuka…
  • Smooth scrolling pada komentar
    Sebenarnya efek smooth scrolling ini untuk menandai sebuah elemen di dalam komentar itu sendiri pada hash target komentar dengan jQuery dan beberapa tambahan css yaitu css target. lihat gambar dibawah ini: Untuk memasangnya pada komentar blog anda, silahkan ikuti langkah dibawah ini 1. Login ke akun blogger Anda. 2. Pilih Template » Ed…
  • Membuat persentase ketika scroll digulung
    Mungkin trik ini terbilang tidak penting untuk mendukung apa pun di dalam blog, namun untuk anda para sobat yang suka dengan kreasi dan menambah unik tampilan, persentase scroll bisa dipasang sebagai hiasan. Dengan menambahkan persentase scroll, pengunjung akan bisa melihat berapa persen halaman yang telah di scroll/ia gulung, jika penggulung…
  • Daftar Isi Blog Tampilan Dinamis dengan jQuery
    Jika sebelumnya kita membahas daftar isi otomatis jquery navigasi maka sekarang kita coba membuat 'Daftar Isi Blog' dengan tampilan dinamis accroding dapat menggunakan jQuery seperti gambar di atas. Caranya gampang sobat Blogger, ikuti petunjuk berikut: 1. Login ke akun blogger anda 2. Pilih Entri Baru/Buat laman baru atau bisa menambahkan di…
  • Membuat Widget Numpage Navigasi untuk Komentar
    Komentar dengan Navigasi Widget Blogger adalah Widget untuk Komentar Anda. By Default Blogger Komentar ini memiliki navigasi halaman link (Terlama, Lama, Baru dan Terbaru) di bagian atas dan bawah bagian Komentar. Sementara pada pada Blogger yang Upgrade ke Threaded Comment, link pagination ini telah menghilang. Namun, Jika Anda ingin mengguna…
  • Mengompress data Javascript tools YUI Compressor
    Mungkin blog tanpa javascript akan terasa biasa saja dan menjadi kurang menarik, itu semua menurut saya. karena dengan javascript kita dapat menciptakan hal - hal cantik dengan efek yang terlihat unik untuk sebuah tampilannya. dengan semakin majunya javascript berbagai hal yang terbilang berhubungan dengan blog kini banyak tercipta, bila anda …

2 komentar

  1. bagus juga ya mas, dengan memasang jumlah post akan diketahui oleh banyak pengunjung blog kalau blog kita sudah memiliki banyak artikel

    BalasHapus
    Balasan
    1. iya mbak, dengan sedikit modifikasi bisa di pasang di mana saja termasuk widget...

      Hapus

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...