Cara Membuat Read More Blog

Membuat read more atau baca seterusnya dilakukan untuk meringkas isi artikel posting. Lebih menghemat isi posting yang sangat panjang. Bisa dibayangkan bagaimana kalau kita memiliki artikel yang panjangnya sampai 40 paragraf. Itu baru satu judul, jika di menu utama ada 20 artikel maka akan sangat panjang dan mengganggu proses loading baca halaman utama blog. Kalau misalnya ada yang datang ke blog kamu untuk baca, tentunya dia harus menunggu lama agar semua isi postingan itu tampil. Postingan ini buat kawan Delis yang sempat menyakan cara membuat read more, semoga bermanfaat ya. Setelah read more dipasang maka yang ditampilkan pada posting hanya satu atau dua paragraf saja. Setelah tulisan read more diklik, barulah tampak isi keseluruhan dari artikel tersebut. Satu hal yang kusuka dari trik ini akan membuat tampilan posting lebih manis dan cantik. Elok dipandang mata.

Untuk menambahkan readmore, yang perlu kita tambahkan adalah kode html pada html template blog kita. Readmore yang ini dikhususkan pad template blog baru. Agak sedikit susah memang, tapi dengan kesabaran apapun bisa dilakukan dan bisa diraih bergaya pahlawan . Tapi kalau terlalu sabar juga bakal kelamaan ya. Seperti yang sedang kamu baca ini, terlalu lama dan kebanyakan pembukaan. Ikuti langkah cara membuat readmore di bawah ini.

Langkah Pertama
Loggin ke blog dengan ID kamu » klik Pengaturan » klik Format. Perhatikan pada kolom paling bawah ada tulisan Template Posting. Isilah kotak isian dengan kode berikut:

<span class="fullpost">

</span>

Setelah itu klik Simpan Setelan.

Langkah Kedua
Klik menu Tata Letak selanjutnya Klik Edit HTML dan beri centang pada kotak kecil bertuliskan Expand Template widget. Satu lagi, sebelum mengedit HTML template blog maka ada baiknya template tersebut di backup dulu. Untuk membackup template silahkan klik tulisan Download template lengkap. Simpan template tersebut pada komputer kamu. Sekarang kita sudah bisa mulai bermain-main dengan html template blog.

Cari kode di bawah ini:

<div class='post-header-line-1'/>
<div class='post-body entry-content'>

Untuk memudahkan pencarian, pada kebor silahkan tekan F3 atau Ctrl F. Akan muncul tool pencarian dan copy beberapa karakter kode yang mau dicari dan paste di dalam kotak cari tadi. Maka kode yang dicari akan ketemu. Bila sudah, silahkan melanjutkan dengan copy dan paste kode di bawah ini tepat di bawah kode yang di atas:

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

Bila sudah selesai, kamu perhatikan bahwa di bawah kode yang kamu paste tadi adalah kode berikut:

<data:post.body/>
<div style="'clear:"> <!-clear for photos floats ->
</div>

Kemudian di antara kode

<data:post.body/>

dan kode

<div style="'clear:"> <!- clear for photos floats ->
</div>

masukkan kode berikut:

<a expr:href='data:post.url'>Read More »» </a>
</b:if>

Sehingga menjadi seperti ini:

<data:post.body/>
<a expr:href='data:post.url'>Read More »» </a>
</b:if>
<div style="'clear:"> <!-clear for photos floats ->
</div>

Keseluruhan hasil akhir adalah berikut:

<div class='post-header-line-1'/>
<div class='post-body entry-content'>

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

<div style="'clear:"> <! -clear for photos floats ->
</div>

Perhatikan kode yang berwarna biru adalah kode yang telah ditambahkan. Da kamu bisa mengganti tulisan readmore dengan kalimat lain. Misalnya baca seterusnya, baca selanjutnya, klik saya untuk kelanjutan artikel, klik di sini, lanjutkan membaca, continue reading dan apa saja yang menjadi kalimat kesukaanmu. Jika sudah selesai, maka klik simpan template.

Silahkan diuji dengan membuat artikel baru pada blog kamu dan lihat hasilnya. Untuk artikel posting yang sudah sempat dipublish, kamu tinggal mengedit artikel pada edit posting dan tuju edit html posting. Tinggal pilih berapa paragraf yang mau ditampilkan di awal posting. Kalau saya biasanya satu atau dua paragraf pertama saja yang ditampilkan. Pada saat mulai membuat tulisan di blog maka perhatikanlah Edit HTML. Urutan penulisan artikel adalah sebagai berikut:

Di sini adalah paragraf yang akan ditampilkan sebelum read more. Boleh satu atau dua paragraf.

<span class="fullpost">

Di sini adalah tempat kamu menuliskan kelanjutan dari artikel setelah tulisan read more.

</span>

Oke, selamat membuat read more di blogspot. Semoga berhasil dan tidak ada cacat. Kalau ada, ya tinggal diulangi saja dengan mencoba lagi.

Related Post:

Widgets

• Pasang Widget Top Commenters Di Blogger
• Pasang Widget Top Posts Di Blogger
• Pasang Widget Kode Warna Pada Blogger
• User Online Widget Whos Amung Us
• Related Posts With Thumbnails Dari Aneesh
• Related Posts With Thumbnail Dari LinkWithin
• Membuat Related Posts Fungsi Scrolling
• Pasang Widget Recent Comments Blogger
• Pasang Widget Recent Post Blogger
• Membuat Tab View Widget Blogger
• Membuat Kotak Pencarian Di Blogger
• Mengganti Read More Dengan Banner
• Label Cloud Fitur Terbaru Blogger
• Membuat Label Cloud Blogumus Blogger
• Membuat Form Berlangganan FeedBurner
• Read More Dengan Judul Posting
• Membuat Related Post Blogger

or or