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% [?]
Related posts :
- Memotong Postingan Yang Terlalu Panjang (Membuat Readmore di Blogger Lama, Classic Template) Jum'at pagi yang cerah ceria ini saya jalan-jalan bersama neng
- Memasang Widget Bookmark & Share Addthis Salah satu alasan kenapa kita memasang widget bookmark & share
- Mengatasi Kerenggangan (Jarak) Ketika Membuat Table di Blogspot Beberapa hari yang lalu ada pertanyaan masuk lewat form komentar
- Fasterfox 3.0.4 Membuat Firefox Lebih Cepat (lagi) Dulu saat pertama firefox 3.0.0 muncul banyak add-on yang tidak
- SUBMIT ARTIKEL GRATIS Salah satu cara untuk meningkatkan trafik ke situs anda ialah












Hi, my name is Hakimtea, I like drink a cup of tea n blogging is really my cup of tea :) I've been dreaming to be a fulltime Blogger, I imagine to be a Master Blogger... when I wake up and realize that all my dreams are still like all I consume, an ordinary Hakimtea... a newbie Blogger who try to write, sharing information and getting money from blogging.
March 3rd, 2008 at 11:24 pm
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!
March 4th, 2008 at 2:24 am
Sama2 mas yud, saya juga masih belajar, kita belajar sambil berbagi saja, blogging dan berbagi
Amien do’anya!
March 7th, 2008 at 8:51 am
Makasih ya…….
saya jadi bisa buat read more……
walaupun saya masih smp…..
sekali lagi terimakasih..
Sukses slalu!!
Wassalam
March 7th, 2008 at 9:34 am
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
April 2nd, 2008 at 9:56 am
Alhamdulillah nemu lagi ( eh salah ya. he he he)
link ‘klik disini’
May 8th, 2008 at 10:36 am
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*
May 8th, 2008 at 12:41 pm
Wah, ini ni yg saya cari-cari…
Thx yah…
May 15th, 2008 at 4:01 am
Edited post.
Silahkan dicoba!
Kalo masih ada kesulitan silahkan beri komentar disini!
June 23rd, 2008 at 12:55 pm
oh ya, katanya kode bisa diganti jadi …apa bener? thanks ya
July 25th, 2008 at 2:44 am
Muanteb…… top Markotop……………..
August 10th, 2008 at 1:39 pm
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
September 1st, 2008 at 6:38 pm
Untuk Redmore…nya sudah jadi tapi comment dibawah posting belum jadi Bos…coba lagi ach
September 21st, 2008 at 3:05 pm
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
October 26th, 2008 at 7:16 pm
info yg sangan berguna.
kunjungi du-spot.blogspot.com & klik adsnya.
thx
December 24th, 2008 at 3:22 pm
makasih ya mas..
January 5th, 2009 at 9:35 am
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)
February 6th, 2009 at 7:43 pm
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
February 13th, 2009 at 5:33 pm
kok pada hilang semua postingan nya ya kang?
May 18th, 2009 at 7:00 pm
[...] Membuat-readmorE [...]
May 20th, 2009 at 4:30 am
Duh mas iki cek pintere rek
June 23rd, 2009 at 7:10 am
Haiii… nanya donk..koq di ‘edit html’ ku ga ada :
atau
atau
August 12th, 2009 at 3:05 am
Emang info ini yg sdg q cr, mksh mz… Semoga sukses sll