Membuat Readmore di Blogger
Membuat readmore atau menyingkat tulisan di blog, maksudnya memberikan tanda “Read More…” Atau “Baca Selengkapnya…” atau cukup “Selengkapnya…” di bawah tulisan kita yang dipersingkat. Agar tulisan yang panjang tidak seluruhnya tampil biar tidak memakan tempat.
To the point saja, di bawah ini merupakan langkah-langkah cara menyingkat tulisan atau memasang readmore di Blogger baru (layout template):
- Klik layout -> template -> edit HTML. Lalu beri tanda ceklis pada “Expand Widget Templates”.
- Karena masing-masing struktur template berbeda maka pada kotak Edit Template cari salah satu kode berikut:
<div class='post-header-line-1'/>
atau<div class='post-header-line'>
atau<div class='post-body entry-content'>
Untuk mencari kode tersebut, jika Anda menggunakan browser firefox cara mencarinya cukup mudah tinggal copy salah satu kode yang akan dicari tersebut, tekan CTRL + F di tempat pencarian (di edit html blog Anda) lalu paste kode yang akan dicari di area Find: yang akan muncul setelah menekan CTRL + F dan otomatis kode yang Anda cari jika sesuai akan langsung ditemukan. Jika belum menggunakan firefox silahkan download dulu disini.
- Kalau sudah ketemu; Tahap pertama (ada dua tahap) kita copy-paste 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>
Paste dibawah salah satu kode berikut yang ada pada template blog Anda,
<div class='post-header-line-1'/>
atau<div class='post-header-line'>
atau<div class='post-body entry-content'>
- Tahap kedua, copy kode berikut,
<b:if cond='data:blog.pageType != "item"'><br />
<a expr:href='data:post.url'>Read more...</a>
</b:if>
</b:if>
Paste dibawah kode <p><data:post.body/></p>
- Kalo petunjuk di atas sudah dilakukan, maka hasilnya akan seperti ini: (perhatikan warna biru sebagai kode tambahan)
<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>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'><br/>
<a expr:href='data:post.url'>Read more�</a>
</b:if>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
- Jika sudah klik SAVE TEMPLATE.
- Dari menu TEMPLATE kita pindah menu; klik Settings (Pengaturan) >Formatting (Format). Dibagian bawah ada tulisan Post Template (Template Posting), isi kotak dipinggirnya dengan kode berikut:
<span class="fullpost">
</span>
Klik SAVE (Simpan Pengaturan).
- Terakhir, setiap akan mempublish postingan, klik Edit HTML dan sisipkan kode tersebut diantara postingan yang akan ditampilkan dan disembunyikan. Contoh,
- Kode
</span>tersebut disimpan paling akhir tulisan (postingan) Anda!.
Ini merupakan paragraf pertama isi postingan Anda. <span class="fullpost"> dan ini merupakan paragraf selanjutnya postingan Anda yang tidak akan terlihat kecuali link read more di klik oleh pengunjung blog Anda.</span>
Silahkan dicoba!
________________
Masih pake template classic…?!? Klik disini cara membuat readmore untuk template classic.
PS: Saat akan mempublish postingan usahakan tidak ada tag </span> lain selain </span> readmore berikut <span class="fullpost"> dan </span>, jika ada akan mengakibatkan terjadi kecelakaan dahsyat readmore tidak berfungsi dengan baik. Caranya edit postingan pada edit html jangan di Compose.
Popularity: 7% [?]






Jujur aja. saya mmasing amatir dalam halblogger, and you’ve done such an immense help for me by putting these tips. THANKS A LOT! smoga makin maju dan jaya. Sukses!
Sama2 mas yud, saya juga masih belajar, kita belajar sambil berbagi saja, blogging dan berbagi
Amien do’anya!
Makasih ya…….
saya jadi bisa buat read more……
walaupun saya masih smp…..
sekali lagi terimakasih..
Sukses slalu!!
Wassalam
Sama2 dek Imam
Belajar ga ngenal usia kan meski masih smp tapi kode2 sprt itu juga mesti bisa walau ga perlu dihafal ^_^ Makasih! Sukses juga, wasalam
Alhamdulillah nemu lagi ( eh salah ya. he he he)
link ‘klik disini’
wa boss, kok katanya gini siy.. :
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: Open quote is expected for attribute “{1}” associated with an element type “cond”.
what hepen aya neon tuh bos ?
*gelapgapahambloondotcom*
Wah, ini ni yg saya cari-cari…
Thx yah…
Edited post.
Silahkan dicoba!
Kalo masih ada kesulitan silahkan beri komentar disini!
oh ya, katanya kode bisa diganti jadi …apa bener? thanks ya
Muanteb…… top Markotop……………..
Assalamu alaikumm….
Ni aku lagi,, skdr info aku baru saja berkelahi dengan kode2 htmlnya seperti instruksi yang mas Hakim contohkan di atas,,, pokoknya seru banget deh… dan sekarang aku sudah punya readmore2 gitu, tapi aku ubah jadi ‘seterusnya…..”. ya… mirip2 punya kang hakim lah, tapi aku pake titik2 di belakangnya bukan tanda panah….
oh ya… main2in html itu asyik juga, asyik skali malah…. ini smw atas jasa mas hakim…. thx dan sukses always
Untuk Redmore…nya sudah jadi tapi comment dibawah posting belum jadi Bos…coba lagi ach
mas makasih banyak atas tutorialnya,cmn kenapa ya ketika step by step langkah-langkah diatas dah q lakukan kok postingan di blog ku sebelumnya malah hilang semua?..trs sewaktu q mo posting lagi, saya dah lakukan seperti yang mas katakan,jd kata “Ini merupakan paragraf pertama isi postingan Anda” saya taruh seblum sintak dan kata “ini merupakan paragraf selanjutnya postingan Anda yang tidak akan terlihat kecuali link read more di klik oleh pengunjung blog Anda.” saya taruh diantara sintak ” dan sintak ” “. Mohon bantuan,terima kasih
info yg sangan berguna.
kunjungi du-spot.blogspot.com & klik adsnya.
thx
makasih ya mas..
Kang Hakim…Sebelumnya terima kasih…saya udah ikuti langkah2 tuk membuat “read more” setetelah disave template terjadi error….mohon bantuannya kang hakim.terima kasih.(http://zegalainformasi.blogspot.com)
jujur saya sudah mempraktekan semua resep termasuk dari Mas Hakim tapi nggak pernah berhasil. Kalaupun berhasil ada read morenya postingan masih nongol di halaman depan. Sekarang malah postingan nggak nongol. Mas Hakim atau siapapun tolong saya di yeye.thok@gmail.com. Saya dah pusing, pusing sudah lebih dari sepuluh jam tapi nggak berhasil. Siapapun please
kok pada hilang semua postingan nya ya kang?
[...] Membuat-readmorE [...]
Duh mas iki cek pintere rek
Haiii… nanya donk..koq di ‘edit html’ ku ga ada :
atau
atau
Emang info ini yg sdg q cr, mksh mz… Semoga sukses sll
bagus banget artiklenya… sangat membantu saya…
thanks banget….
Cacvra.com latest post How to Clean History in Internet Explorer
Di wordpress untuk bikin read me lebih gampang yah. Saya pikir di blogger juga gampang, ternyata agak ribet.
kenapa setelah saya coba semua tulisan di blog saya tidak dapat muncul. walaupun saya klik item yang ingin saya lihat.
mohon koreksi, mungkin langkah saya ada yang salah………….