02 February 2012

Cara membatasi jumlah posting yang muncul pada label

Jumlah posting yang muncul pada halaman beranda atau homepage dapat dibatasi sesuai keinginan kita tanpa harus masuk ke edit html. Disini saya beranggapan bahwa anda telah dapat mengatur jumlah posting yang muncul di homepage.  Pembahasan kali ini terfokus pada cara membatasi jumlah posting yang akan ditampilkan ketika label diklik.

Jumlah postingan dalam label ketika diklik, secara default blogger tidak memberikan batasan.  Sehingga bila kita mempunyai artikel dalam satu label sejumlah 100 artikel maka berapa meter panjang blog kita. Tentu sangat tidak nyaman bagi pengunjung karena harus memutar-mutar scroll mouse yang sangat melelahkan.

Memang sih dengan adanya readmore dapat memotong artikel agar tidak ditampilkan seluruhnya, hanya beberapa kalimat saja tergantung pada dimana akan diletakkannya pemenggal paragraf (readmore). Tetapi masih tetap panjang bila setingan label masih default dan tidak kita batasi. Dan tentu saja akan menambah berat loading blog.

Nah untuk membatasi jumlah posting yang tampil dalam satu halaman ketika label diklik, perlu ditambahkan kode pembatas seperti di bawah ini.
+ "?max-results=7"
Angka 7 di atas menunjukkan berapa banyak jumlah posting yang ditampilkan per halamannya. Silakan ganti sesuai dengan keinginan Anda.

Sekarang akan kita praktekkan di template blog kita. Namun, sebelumnya pastikan bahwa Anda sudah memasang widget label di sidebar blog Anda. Anda bisa memilih label berbentuk daftar atau list atau bisa juga label yang berbentuk cloud.

Setelah selesai memasang widget label, selanjutnya adalah membatasi jumlah posting dalam label, caranya:
  1. Masuk ke akun Blogger Anda.
  2. Klik Rancangan > Edit HTML.
  3. Klik Download Template Lengkap untuk mem-back up template. Hal ini dilakukan untuk mengantisipasi kalau nanti terjadi kesalahan dalam pengeditan.
  4. Beri tanda centang pada Expand Template Widget.
  5. Cari kode seperti di bawah ini. Gunakan Ctrl + F untuk memudahkan pencarian.
  6. <ul> <b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span dir='ltr'>(<data:label.count/>)</span> </b:if> </li> </b:loop> </ul>
  7. Tambahkan kode pembatas + &quot;?max-results=7&quot;
  8. Sehingga hasilnya akan seperti di bawah ini.
  9. <ul> <b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url + &quot;?max-results=7&quot;'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span dir='ltr'>(<data:label.count/>)</span> </b:if> </li> </b:loop> </ul>
  10. Kode di atas adalah kode untuk label yang berbentuk list. Sedangkan untuk labelcloud, silakan cari kode seperti di bawah ini. Letaknya di bawah kode label list.
    <b:loop values='data:labels' var='label'>
    <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
    <b:if cond='data:blog.url == data:label.url'>
    <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
    <b:else/>
    <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
    </b:if>
    <b:if cond='data:showFreqNumbers'>
    <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
    </b:if>
    </span>
    </b:loop>
  11. Tambahkan kode pembatas + &quot;?max-results=7&quot;
  12. Maka hasilnya akan tampak seperti di bawah ini.
    <b:loop values='data:labels' var='label'>
    <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
    <b:if cond='data:blog.url == data:label.url'>
    <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
    <b:else/>
    <a expr:dir='data:blog.languageDirection' expr:href='data:label.url + &quot;?max-results=7&quot;'><data:label.name/></a>
    </b:if>
    <b:if cond='data:showFreqNumbers'>
    <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
    </b:if>
    </span>
    </b:loop>
  13. Klik tombol SIMPAN TEMPLATE.
  14. Selesai.

Cara di atas berlaku pada sebuah label yang diklik di widget label, baik label daftar atau label cloud. Namun, untuk link label yang terdapat di menu navigasi breadcrumbs dan post footer line, link label tersebut bila diklik masih menampilkan semua posting.

Nah, bila Anda ingin membatasi juga jumlah posting yang tampil pada label di kedua lokasi tersebut, silakan simak langkah-langkahnya di bawah ini.
  1. Lakukan langkah no. 1 - 4 pada langkah di atas.
  2. Cari kode seperti di bawah ini  atau yang mirip dengan kode tersebut, yaitu kode untuk menu navigasi breadcrumbs.
    <div id='breadcrumbs'>
    Browse: <a expr:href='data:blog.homepageUrl'>Home</a> &gt; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'> &gt; </b:if>
    </b:loop>
    </b:if> &gt; <a expr:href='data:post.link'><data:post.title/></a>
    </div>
  3. Tambahkan kode pembatasnya, maka hasilnya seperti di bawah ini.
    <div id='breadcrumbs'>
    Browse: <a expr:href='data:blog.homepageUrl'>Home</a> &gt; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url + &quot;?max-results=7&quot;' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'> &gt; </b:if>
    </b:loop>
    </b:if> &gt; <a expr:href='data:post.link'><data:post.title/></a>
    </div>
  4. Cari kode seperti ini di bawah ini atau yang mirip dengan kode tersebut, yaitu kode untuk label pada post footer line.
    <div class='post-footer-line post-footer-line-2'><span class='post-labels'>
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
    </b:loop>
    </b:if>
    </span> </div>
  5. Kemudian tambahkan kode pembatasnya, maka jadinya akan seperti di bawah ini.
    <div class='post-footer-line post-footer-line-2'><span class='post-labels'>
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url + &quot;?max-results=7&quot;' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
    </b:loop>
    </b:if>
    </span> </div>
  6. Klik tombol SIMPAN TEMPLATE.
Mudah-mudahan dengan dibatasinya jumlah posting yang muncul dalam label dapat menjadikan tampilan blog lebih baik, pengunjung menjadi nyaman dan akan kembali lagi di kemudian hari.

7 comments:

  1. makasih untuk infonya mas...

    ReplyDelete
  2. Thanks infonya...
    visit my blog http://punya-rizal.blogspot.com

    ReplyDelete
  3. Replies
    1. @Roydo Ari Pratama;
      Baca kembali pelan-pelan jangan sampai ada kalimat yang terlewatkan, tips ini sudah saya praktekkan di semua blog saya. bila tidak bisa diterapkan di blog anda mungkin struktur templatenya yang berbeda.
      Demikian, mudah-mudahan puas dengan jawaban saya. thanks

      Delete
  4. berhasil 1 label 7 post, tapi kok ga bisa next ke post slanjutnya ya ?ga ada pilihan next / halaman gitu

    ReplyDelete
    Replies
    1. ada pilihan next koq,.. aku dah liat blog kamu.

      Delete

Note: Only a member of this blog may post a comment.