Membuat "read more" Yang Praktis

Space atau ruang di blog kita sangat terbatas, jika kita menampilakan semua isi dari postingan atau entri maka akan memakan banyak space (tempat). Bayangkan saja orang melihat halaman yang luas, maka orang akan sulit untuk memfokuskan diri.

Sebenarnya ini sama dengan membuat read more, tapi lebih praktis, karena kita tidak perlu menambahkan sesuatu kode HTML saat memposting artikel kita. Read More yang akan kita buat akan membuat kita gampang atau mudah dalam memengal isi dari postingan kita. Beberapa kalimat akan muncul dan jika dalam postingan kita ada gambarnya juga akan disertai thumbnail (gambar diperkecil)

Ada yang memberi nama read more yang akan kita buat ini dengan nama read more liberal, oleh kang Jaloe. sekarang kita bersiap untuk mempraktekanya :z Perhatikan dan baca seksama langkah-langkahnya.

Cara Membuat "read more" Yang Praktis
1. Login ke Blogger
2. Pilih Tata Letak kemudian pilih Edit HTML
3. Beri tanda cek (centang) pada “ Expand Widget Templates “
4. Cari kode di bawah ini

</head>

5. Jika sudah ketemu taruh kode berikut ini di bawahnya

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

6. Cari kode di bawah ini

<data:post.body/>

7. Ganti kode yang telah kita temukan di atas dengan kode berikut ini

<b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> read more &#8220;<data:post.title/>&#8221;</a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

8. Simpan Template Kalau sudah beres

Silahkan kamu coba sekarang, tapi berikut ini catatan yang juga perlu kita ketahui:
summary noimg= 430 adalah tinggi artikel terpenggal tampa image
summary img=340 adalah tinggi artikel terpenggal dengan image
Jika kamu kesulitan mencari kode-kode tersebut baca tipsnya di sini


Enter your email address:

Baca juga pelajaran ngeblog lainnya

56 komentar:

Baka Kelana mengatakan... Balas Komentar

Mantap Bos....patut dicoba

yangputri mengatakan... Balas Komentar

wah aku bisa belajar banyak dong dari mas kurnia
ajarin aku ya.... :D
salam kenal

jaloee mengatakan... Balas Komentar

huhu.. memang praktis bangeut ngga perlu cape dua kale...

oh iye.. ttg sitemap untuk wp sy beloem pernah nyoba boss

Rusa Bawean mengatakan... Balas Komentar

wahhh
tips yang keren neh keknya

KURNIA SEPTA mengatakan... Balas Komentar

Read more yang dulu, lansung saya ganti dengan yang baru ini :)
lebih praktis, lebih cepat, lebih rapi :))

tronsil mengatakan... Balas Komentar

oke, thanks yaa

G.i.S mengatakan... Balas Komentar

Keren maksih bos ilmunya.....:-/

ciel mengatakan... Balas Komentar

ini kan kalo di blogger,

lha kalo di dagdigdug.com gmn?

Blogger Jakarta mengatakan... Balas Komentar

ane pake tips ente brooo..thanx brat..

gie news mengatakan... Balas Komentar

ajarin dunk cara layout pliss kirim ya bang ke gie.saiko@gmail.com

maruli mengatakan... Balas Komentar

omm....tulongin dung..
aku ne mau buat kotak komentae di bawah entrian
ko g bisa bisa ya...
kasih solousinya dunk...
aku butuh tutorial nya
makasih ya om..

ne imail aku
FaiLlinGLuvH@gmail.com
john_polo23@yahoo.co.id

maruli mengatakan... Balas Komentar

ehh sala kotak komentar...

Seti@wan Dirgant@Ra mengatakan... Balas Komentar

Muantav bro,... aku coba.

ipul mengatakan... Balas Komentar

thak's,
cuy,,,,,,,
;;)

Sowabiqul mengatakan... Balas Komentar

minta ijin nge"link" ke blog sampean ya kang!
soale kadang ada yang tanya soal tutorial blog, and aku banyak gak bisa nya!
mending langsung tak tunjukin suruh kunjungi blog ini aj!

budi afriZaL mengatakan... Balas Komentar

THANK YA...gw dapet banyak masukan dari mas septa

Billy the Kid mengatakan... Balas Komentar

Thankz tipsnya mas. Minta izin posting di blogku ya...:D

Taufiq Salma Adila mengatakan... Balas Komentar

-x(
kakak yang baik..
thank bwt segala informasinya..
kita mu ikutan lomba antar blog di kota kami..
kalo bikin read more ada cara di buku..
tapi bikin pusing,terus jadinya blog kita rusak parah..
thank ya kakak !!
:)

Ekajaya mengatakan... Balas Komentar

Mantap bos,Trim's

Nirwan mengatakan... Balas Komentar

makasih boooosss...

andryhisyam mengatakan... Balas Komentar

Sudah tak jajal bos...lihat aja blogku...trims ya boss.

bani mengatakan... Balas Komentar

:))

bani mengatakan... Balas Komentar

kiri, ke palembani.blogspot.com ;) " :-t heheh aduh b-(

Progresif Man mengatakan... Balas Komentar

thank bozz za... from http://massyaifur.blogspot.com

Uchea Lavdiv mengatakan... Balas Komentar

mampir yukk,

blognya ga kreatif, maklum baru belajar

uchealavdiv.blogspot.com

Ahmadsyah mengatakan... Balas Komentar

terimakasih read more nya sangat bermanfaat bagi saya

AyunYun mengatakan... Balas Komentar

MANTAP .....
Hahahha... ^____^

Edho Rifaldo mengatakan... Balas Komentar

Subhanallah, syukron.
ini yang slama ini ana cari..... :))
Jazakallahu khair....

Islam - Q mengatakan... Balas Komentar

syukron, tutorialx lengkap..... ;)

aristokrat mengatakan... Balas Komentar

makasih banget,,

www.aristokrat-scienza.blogspot.com

Dunia Komputer mengatakan... Balas Komentar

Thankz Bozt....!!!!!
:))

Harian Lampung mengatakan... Balas Komentar

Trims infonya. Tapi kenapa di dalam kolom Expland Template Widget blog saya tidak ada kode ini : yaaaa??? Sudah saya cari menggunakan Ctrl + F, tapi tetap tidak ada. Di bagian manakah kode itu??? Trims...

Harian Lampung mengatakan... Balas Komentar

NB : yang saya maksud kode ini ialah kode data:post.body/ trims...

Amazing WorlDs mengatakan... Balas Komentar

Thanks infonya

And's Jefferson mengatakan... Balas Komentar

Yang diganti apa?

all about trick in internet mengatakan... Balas Komentar

thank mas kurnia,,,,, keren bgt blognya,,,,,,,,,,,,,,sukses brooootherr

blackdevil mengatakan... Balas Komentar

disertai thumbnail (gambar diperkecil),.
kok gambar na msh besar yha gan??
ngk da thumbnail na?
:((

Asep Saepullah mengatakan... Balas Komentar

keren om =((

Aqila Zafira mengatakan... Balas Komentar

Makasih banyak ye bang atas ilmunye .... ;)

Displaced-™ mengatakan... Balas Komentar

om kurnia ,, gmn ya klw mau hapus readmore nya ...

RD mengatakan... Balas Komentar

om, gimana caranya agar halaman pertama muncul beberapa postingan yg ada readmorenya ????

@mohon bantuannya :)]

iman tamnge mengatakan... Balas Komentar

sorry nih bro....gue coba dulu baru komen.....soalnya gue udah prnah coba dari yg lain tapi gagal.....pas gue coba dri punya bro ternyata berhasil thanks ya bro^_^

gue akan belajar trus dri bro....mohon bantuannya....:D

rudy mengatakan... Balas Komentar

mksh kang ats infonya na

Latifah mengatakan... Balas Komentar

Ma kasiiiiiiiiiiih :) udah berapa hari ini gak bisa2 ngutak atik read more. Maklumlah newbie :D pas liat artikel ini, dicoba, daaaan bisaaaa. Sekali lagi ma kasih ya ^_^

latifahsaja.blogspot.com
sophieparisonlineshop.blogspot.com

Juan Dimas Susanto mengatakan... Balas Komentar

kok gak ketemu ya? nya?

mohon pencerahannya

Putra Nanda mengatakan... Balas Komentar

Makasih mas kurnia, Tips ini sangat membantu blog saya yang begitu sederhana... hahahaha :))

galih mengatakan... Balas Komentar

kak, dari dulu pusing, dimana ya kata "expand widget template" ? (di www.blogger.com)

galih mengatakan... Balas Komentar

kak, dari dulu pusing, dimana ya kata "expand widget template" ? (di www.blogger.com)

SHEILA PRAMITA mengatakan... Balas Komentar

gan, saya dulu pernah buat read more juga..
tapi sudah skitar 5 bulan tiba tiba readmore nya ga berfungsi lagi.
itu knapa ya?
cara memperbaikinya gmn?
bls ya gan ke sini sheila_cut3@yahoo.com
thx

Azmi Farhan mengatakan... Balas Komentar

makasih petunjuknya bang..
kini read more-nya sudah terpasang dengan baik..
tapi..
saya ingin thumbnail yang ada di posting saya sebelum di klik read more, dipotong, bukan di ubah ukurannya (dipipihkan) kira2 caranya gimana ya?
mohon bantuannya..

Buku Panduan Harvest Moon Back To Nature mengatakan... Balas Komentar

makasih bnyak bro ud share,lumayan nambah wawasan saya :)

Cara Pemesanan Ace Maxs mengatakan... Balas Komentar

makasih untuk infonya gan!!

Pandu mengatakan... Balas Komentar
Komentar ini telah dihapus oleh penulis.
Pandu mengatakan... Balas Komentar

Terima kasih atas infonya gan
Sangat berguna sekali, caranya pun mudah dan praktis

Muhammad Ridwan (mademol) mengatakan... Balas Komentar

mas kurnia, udah ane coba dan berhasil. tapi kok halaman utamanya cuma muncul satu post nya yah.. kalau mau munculin lebih gimna ??

Putra Mbelong mengatakan... Balas Komentar

kok udah dicoba tetp aja read more-nya ngga nongol apa ada yang salah yak ......
:-/

Poskan Komentar

Berkomentarlah di blog ini dengan cerdas
* Jangan mencantumkan link apapun, contoh: http://xxx
* Untuk menampilkan emoticon, ketik kodenya, contoh: =))
* Karena banyaknya SPAM, terpaksa kami tampilkan verifikasi kata
Jangan sampai komentarmu dihapus karena tidak mematuhi aturan!