Membuat Readmore

Readmore berfungsi untuk melakukan pemenggalan kalimat agar tampilan sebuah posting dapat dipersigkat. Hal ini mirip sekali dengan koran, artikel berita akan lebih padat dan beragam, sehingga pembaca tidak merasa bosan untuk menikmatinya. Begitu pula dengan postingan sebuah blog, defaulnya posting akan menampilkan seluruh entry dalam sebuah judul posting. Coba bayangkan jika sebuah posting yang panjang ditampilkan, tentu menyita ruang untuk posting lainnya. Padahal posting lain yang kamu masukkan tidak kalah penting dengan posting yang panjang tadi.

Agar hal tersebut tidak terjadi dalam blog kamu, maka perlu trik supaya posting blogger dapat dipersingkat. Caranya dengan menambah dan memodifikasi pengaturan format dan template blogger kamu. Sebagai catatan sebaiknya kamu menggunakan browser Firefox atau yang lainnya, kecuali Internet Explorer untuk menghindari terjadinya galat. Daripada kita ngelantur kemana-mana, langsung saja dimulai trik blogger tentang readmore, yaitu :

  • Login ke blogger kamu.
  • Klik tab Pengaturan --> Format
  • Di layar paling bawah, ada text area kosong disamping tulisan Template Posting, isi area kosong tersebut dengan kode di bawah ini :
<span class="fullpost">
</span>

  • Simpan pengaturan format

  • Pilih tab Tata Letak --> Edit HTML --> centang "Expand Template Widget"

Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

  • Cari kode berwarna merah di bawah ini :

<p><data:post.body/></p>


Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan timbul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

  • Ganti semua kode berwarna merah diatas dengan kode berikut :

<b:if cond='data:blog.pageType == "item"'> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style> <p><data:post.body/> <a expr:href='data:post.url'><strong>Readmore...</strong></a></p> </b:if>


Untuk kode yang bertanda hijau dapat kamu ganti dengan kata yang kamu kehendaki seperti Selengkapnya..., Lanjutannya..., Klik disini untuk melanjutkan..., Baca selengkapnya..., dan sebagainya. Atau kamu bisa menghilangkan atribut <strong> ... </strong> agar tulisan Readmore tidak menggunakan huruf tebal.

  • Jangan lupa di simpan.


Contoh :

Isi semua posting :

Readmore berfungsi untuk melakukan pemenggalan kalimat agar tampilan sebuah posting dapat dipersigkat. Hal ini mirip sekali dengan koran, artikel berita akan lebih padat dan beragam sehingga pembaca tidak merasa bosan. Begitu pula dengan postingan sebuah blog, defaulnya posting akan menampilkan seluruh entry dalam sebuah judul posting. Coba bayangkan jika sebuah posting yang panjang ditampilkan, tentu menyita ruang untuk posting lainnya. Padahal posting lain yang kamu masukkan tidak kalah penting dengan posting yang panjang tadi.

Penambahan kode :

Readmore berfungsi untuk melakukan pemenggalan kalimat agar tampilan sebuah posting dapat dipersigkat. Hal ini mirip sekali dengan koran, artikel berita akan lebih padat dan beragam sehingga pembaca tidak merasa bosan. Begitu pula dengan postingan sebuah blog, defaulnya<span class="fullpost"> posting akan menampilkan seluruh entry dalam sebuah judul posting. Coba bayangkan jika sebuah posting yang panjang ditampilkan, tentu menyita ruang untuk posting lainnya. Padahal posting lain yang kamu masukkan tidak kalah penting dengan posting yang panjang tadi.</span>


Hasil yang ditampilkan :

Readmore berfungsi untuk melakukan pemenggalan kalimat agar tampilan sebuah posting dapat dipersigkat. Hal ini mirip sekali dengan koran, artikel berita akan lebih padat dan beragam sehingga pembaca tidak merasa bosan. Begitu pula dengan postingan sebuah blog, defaulnya
Readmore...




Catatan :

  1. Kode <span class="fullpost"> dan </span> akan muncul, jika kamu melakukan entry posting dalam model edit HTML
  2. Kode <span class="fullpost"> diletakkan setelah posting yang akan kamu tampilkan di halaman utama blog, sedangkan </span> diletakkan pada akhir posting.
  3. Pemenggalan kalimat sebaiknya diatur dengan baik dan sebisa mungkin penggalan tersebut menimbulkan rasa penasaran pengunjung blog kamu untuk meng-klik-nya.
  4. Trik Blogger ini hanya berlaku untuk posting yang baru, sedangkan posting lama tetap seperti biasanya kecuali kamu melakukan edit terhadap posting lama tersebut.
Posting yang berkaitan :

Selamat Membuat Readmore...

18 komentar untuk “Membuat Readmore”

  1. OB saya sudah membuat readmore, tetapi readmorenya tampil di akhir postingan gimana nih caranya?

    BalasHapus
  2. to Kurnia Mahanani: cara pemenggalan kata di postingan saja yang disetting, coba lihat contoh di atas

    BalasHapus
  3. masih blm bisa mas, sudah saya coba di pemenggalan katanya, tapi tetap aja readmorenya berada di akhir postingan. apa harus buat postingan baru? yg saya terapkan ini dari postingan yg saya edit trus saya tambahkan code readmorenya?

    BalasHapus
  4. @kurnia mahanani
    ane coba bantu yach, postingannya jangan pake yang compose klo bisa pake yang HTML karena banyak kasus klo postingan pake mode compose readmorenya gak jalan (ane pernah ngalamin soalnya) jadi klo bisa postingannya pake yang mode HTML yach, trus pemenggalan kalimatnya jangan lupa <span class="fullpost"> ditaro di akhir kalimat yang dipotong dan </span> di akhir postingan

    BalasHapus
  5. ok ok, udah bisa kok. makasih semua atas bantuannya :D

    BalasHapus
  6. OB tidak ada: ..data:post.body... di blogku!!

    BalasHapus
  7. Oke nih infonya, tetep ada yang beda dengan penjelasan blogger lain. Trims.:D
    Cuma, saya sendiri belum tau apakah bisa memasangnya. Maklum baru nih.
    Trus, kalo untuk yang udah keduluan di posting bagaimana?
    Satu lagi, udah dicari cari tapi kode yang dimaksud kok ndak ada ya?
    Kalo bisa mampir dulu deh ke blog saya.

    BalasHapus
  8. thanks brow... eh gimana caranya membuat alexa rank? blz cpt

    BalasHapus
  9. kok, di template blogspot ku gak ada kode merahnya kek punya situ

    BalasHapus
  10. Langsung saya praktekan dan berhasil. makasih bro

    BalasHapus
  11. Sekarang readmore otomatis yg dari Blogspot adakan bos..

    BalasHapus
  12. kebetulan template bawaan ane udah autoreadmore. tapi makash atas tipsnya

    BalasHapus
  13. Mantap nih tipsnya... sayang aku kok gak bisa paham. Banyak banget istilah yang aku gak ngerti soalnya... *maludotcom*
    Aqiqah Murah , Paket Aqiqah ,Jasa Aqiqah

    BalasHapus
  14. sukses selalu dengan infonya sangat menarik sekali dan mantap.lam kenal aja kunjungan perdananya.maju terus........

    BalasHapus
  15. mampir ah.. kenalan.. sambil berharap dapat ilmu dan backlink:D

    BalasHapus