Cara Mudah Membuat Readmore Otomatis di Blog Terbaru


Bagaimana cara membuat readmore di blogspot dengan cara yang mudah dan cepat kilat di blog kesayangan sobat blogger . inilah pokok bahasan yang akan saya bahas untuk anda semua,hehehe.
baik sobat blogger, sebelumnya saya jelaskan sedikit apa gunanya read more pada blog kita. dengan adanya readmore blog sobat tampilan nya di home tidak terlalu memanjang ke bawah seperti tampilan home blog saya yang menggunakan readmore namun disini saya menggantinya dengan tulisan baca selengkapnya, itu seterah sobat.

Berikut cara memasang readmore di blogspot :

-Login ke blogger dengan ID sobat.

-Pilih Rancangan atau Tata Letak.

-Pilih Edit HTML.

-Centang tulisan "expand template widget".

-Lalu cari kode </head> :   untuk mempermudah pencarian tekan F3.

-Lalu masukkan code di bawah ini tepat di atas  </head>

<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 type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

Kemudian sobat  cari kode <data:post.body/>
Ganti kode <data:post.body/>  dengan kode di bawah 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'> <b> readmore</b> &#187;&#187;&#160;&#160; </a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
</b:if>

Kemudian Save Template.
untuk keterangan readmorenya...
var thumbnail_mode = "float";: Letak thumbnail berada di “float” kiri atau jika tidak silahkan ganti dengan “no-float”;
summary_noimg = 250;: Jumlah karakter yang akan ditampilkan di posting tanpa gambar / thumbnail;
summary_img = 250;: Jumlah karakter yang akan ditampilkan di posting dengan gambar / thumbnail;
img_thumb_height = 120;: Tinggi thumbnail dalam ukuran pixel;
img_thumb_width = 120;: Lebar thumbnail dalam ukuran pixel;
READMORE-: Tulisan READMORE bisa diganti misalnya dengan “Baca Selengkapnya” dan apabila anda tidak ingin menampilkan judul dibelakang Readmore, sobat bisa menghapus code script ini .

nah demikian lah tutorial dari berry blog , semoga tutorial blog mengenai cara membuat readmore di blog dapat bermanfaat untuk sobat semua.

Like THIS :
Share this article to: Facebook Twitter Google+ Linkedin Technorati Digg

Jika Anda menyukai Artikel di blog ini, Silahkan berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit.


122 komentar untuk "Cara Mudah Membuat Readmore Otomatis di Blog Terbaru"

Ana Safitri's mengatakan...

Gan mau tanya, biar yang page ga ikut ada readmore-nya harus diapakan?
makasih.

Berry Hardisakha mengatakan...

maksudnya gimana ya ? bisa di kasih cthnya atau di perjelas :)

NET SINCE mengatakan...

Thank's sob..

Software Driver Hack mengatakan...

Makasih atas tutorialx,,
ku sudah coba dan sungguh berhasil...

aku baru pemula,,
bantu aku untuk untuk ngeblog

http://langit-software.blogspot.com/

Ca Ya mengatakan...

makasiii byk,,tertolong nih :D

Ahmad Ngudi mengatakan...

blog saya ada 3 ny gmn ne?
jadi bingung, tlng ksh pnjlsn..

Berry Hardisakha mengatakan...

maksudnya ada 3 nya mas ?

kung chiko dixleksia mengatakan...

sangat bermanfaat sekali ka.. izin copas :D
buat temen2..

Uthie mengatakan...

ada yang lebih simpel penjelasnnya, tinggal copas codingnya...beres deh
makasih banget masbroo

Maru Samosir mengatakan...

thx kk ..
MY BLOG > chords-lagubatak.blogspot.com

gie-com mengatakan...

makasih gan infonya...salam kenal

Arif Prianto mengatakan...

mz gmn carax memper indah css di blogspot????
trims...

Arif Snb mengatakan...

makasih mas

Shindu Ramandita mengatakan...

makasih kang :) dicoba daaaaah :D ... semoga berhasil.. yess...

hakim mengatakan...

keren banget postingnya, makasih

Gasberacun mengatakan...

ini bagus mas bekerja dengan baik, cuma gimana cara ngilangin bagian footernya itu loh yang tulisan diposkan oleh: gimnaa mas?

Knowledge of Asia mengatakan...

Thanks

revisit my blog

kumpulartikels.blogspot.com

gopar-it mengatakan...

kok kalau di pasang laman nya jadi tidak bisa di baca,, cuma read more aja,, gmna itu gan??

dek rif mengatakan...

wah sukses bos,thanks infonya!

Prayoga_krisna mengatakan...

mas klo mau hapus lgi gmana ya?

Herly Deflin mengatakan...

thanks info nya gan
http://setan-logika.blogspot.com/

kulpulan materi mengatakan...

tanks gan infonya.
ijin lksanakan dulu...
knjungi web ane jga gan dn join jga ya..

Your Solution mengatakan...

thank semoga bermanfaat,, :)

Super Refreshing mengatakan...

gan mau tanya nih...?
Bagaimana ya, jika saya pasang read more otomatis di blog, kenapa di tab menunya selalu eror atau tidak terlihat isi tab menunya...?
mohon solusinya ya gan...

magazineticker mengatakan...

thnks gan atas ilmu yang telah diberikan,,,soalnya saya telah berhasil mempraktekkannya,,salam persahabatan selalu. ditunggu info menarik lainnya,,,,,

andy12 mengatakan...

maturnuhun infonya, entar coba ah

i Post mengatakan...

mantebh gan udah ane terapkan di blog ane

muhamad nizar gumilang mengatakan...

gan kok saya gak ada kode di widget jadi susah mau bikin read,bisa d bantu ,hehehe thk

akhyar95 mengatakan...

Thangk's banget atas tutorialnya....

Windows 7 mengatakan...

Mantab infonya..
Kalau hilangkan readmore bisa egk ya??

Santi Andriyanti, MBA. mengatakan...

Makasih Infonya... Tolong bantu add di blog'qu yah, tks

Santi Andriyanti, MBA. mengatakan...

O...iya, mau tanya nih? Kalo data ada 2 pilihan... kira-kira yang diganti yang mana yah....

endekdirwan mengatakan...

makash bgt gan info nya berguna, gue bru nih di blog. .di mohon bimbingan dan juga saran dan kritik nya gan. . . Di tgu kunjungan dan saran dan kritik di blog saya?

Gopar mengatakan...

makasih share nya

Bang Mul mengatakan...

terima kasih infonya sob...sudah aku coba dan bekerja dengan sangat baik.......

jangan lupa mampir di "bang mul blogs"

terima kasih

M Yanhar mengatakan...

Informasi yang bermanfaat bagi kita bersama.
terima kasih sob..

Mutiara Kehidupan mengatakan...

Muantap infonyaa... makasih banget...

nakusan computer mengatakan...

nice share Sob...

Asep Komba mengatakan...

nice share shob.. thanks..

KHILAFAH RISER mengatakan...

Sip gan ^_^b thanks.

Farid`s mengatakan...

susah nieh g jadi-jadi

Muhammad Janualdi mengatakan...

Bagus Ni,, Coba yaa!!

Please Follow jg blog saya..
www.janualdi.blogspot.com

Adib Mahfudli mengatakan...

udah ku coba oke berhasil.
tapi untuk "pages / laman entri khusus" kode read more ini eror.
di klik readmore tetap halaman web-ny tidak terbuka seutuhnya.

Anonim mengatakan...

matur nuwun gan..
aku ijin copast ya..
ilmunya sangat bermanfaat,,, :D

Namo mengatakan...

Trim's broo....
http://soccerbarcablog.blogspot.com/

sukmawan pradika mengatakan...

Setelah sekian lama mencari akhirnya berhasil. thanks bro

Sepedagoes mengatakan...

Ngga bisa2 bos punyaku, udah ada 4 script yg dicoba slalu gagal script yg ini tulisannya gini /:
"Kesalahan saat mengurai XML, baris 2, kolom 2: The markup in the document following the root element must be well-formed."

Udah dicek berkali2 udah cocok

Darman Adytia mengatakan...

Bagus.. mantap... akhirnya RaedMore ku kembali lagi setelah sekian lama menghilang.. akhirnya ketemu juga ni artikel yang emank pas bangat.... makasih banyak Gan... sukses terus

siti saodah mengatakan...

ko ga bisa yah gmana niih

Ilham Ali mengatakan...

Gan di saya Tata letak nya gga ada tulisan "EDIT HTML" ..
Jadi hrus gimana dongs ??

Cara Terbaru mengatakan...

Terima kasih tutorial nya,,
working

Arif Rahmadhani mengatakan...

punya gw kok gk ada nya sih ??

Tips Blogspot mengatakan...

artikel yang sangat lengkap. terima kasih

Anonim mengatakan...

kode "head" ada tapi yang "data:post.body/" gak ada, gimana dong??

eyeshield21 mengatakan...

ok banget gan....

Ferry Croot mengatakan...

makasih ini ngebantu banget mas :)

Iphand Putra Muhammad mengatakan...

mampir sejenak yuk kawand di blog newbie anee :D
jangan lupa tinggalkan coment/like ya kawand :D
salamm bloggerr :D

http://iphand9.blogspot.com/

Alexander Blue mengatakan...

Thx gan infonya berguna banget.

Silakan bagi yang mau coba berkunjung ke blog gw yang masih nubi ini ^^ : axblueworld.blogspot.com

dunia belajar mengatakan...

thanks gan tutornya ..sangat membantu bagi nuwbie seperti saya....salam kenal

Ulfa Damayanti mengatakan...

Terimakah atas infonya. Berguna sekali buat saya yg masih newbie. Setelah mencoba ternyata berhasil. Makasih ya.

Software Download Full mengatakan...

makasi mas bro ...

Sangat bermanfaat ....

Dwi Cahyo Widodo mengatakan...

Thx mas bro.. bermanfaat banget nih.. :D nice Tips N Trik yo..

Sukses selalu ...

Visit blog baru saya :D
bukuonline-ku.blogspot.com

muhamad fikram akbar mengatakan...

makasih kk skrang blog ku jdi indah nih blogku

akbar-afdal.blogspot.com

irvan kun blogz mengatakan...

kenapa di blog ku gak berhasil ya ? ada solusi gak sob ?

fais candra pratama mengatakan...

izin sedot,soalnya gue akuin blog agan sangat bagus,beda ama lain,cara membuat readmore di blog lain bnyk yang gagal kecuali mas.saya salut banget kunjungi blackpendant.blogspot.com

Ian Apian mengatakan...

kalau blog nya punya laman pasti laman nya gak bisa dibuka
contoh
http://blog-amatirku.blogspot.com/

wahyu istianto mengatakan...

gan klo gk ada kode itu nya gmna?
koq gw gk ada ya -_-
mksh slam kenal klo ada waktu revisit ke blog ane gan http://dunia-esemka.blogspot.com/ mksh :)

Berry Hardisakha mengatakan...

kalau gk ada gan cb ganti template yg udh ada readmore aja gan..

karim mengatakan...

agak bingung gan yang mengenai 250 kata itu,,,
tapi terima kasih share artikelnya...

unikgaul.com mengatakan...

wah udah bisa gan, makasih bgt infonya :D

Hazhama MafiaWare mengatakan...

Gan SAYA ADA KODE 4 PILIH YANG MANA?

<data:post.body nya ada 4

Berry Hardisakha mengatakan...

susah juga kalau gt jelasinnya gan, gini aja, agan back up dulu templatenya, simpan, setelah itu agan coba 1 persatu kodenya, semoga berhasill.. jangan lupa diback up templatenya

syamsul mengatakan...

Makasih sob ilmunya udah ane terapin di blog baru ane dan berhasil ane pasang meta tagnya, tinggal nunggu kunjungan dari mbah google aja nih...http://peluangusahawebsitepemula.blogspot.com/

mudera sa mengatakan...

THANKS BROWWWW

TOLILNG FOLLOW Q D WWW.PELAJARANMAYA.BLOGSPOT.COM

Zaky Mubarok mengatakan...

nice info
thank's

ditunggu kunjungan baliknya
dsingo.blogspot.com

AHMAD MAKMUN mengatakan...

makasih sya ijin copas,semogailmu anda manfaat dunia aherat

:::Luhur Muhamad Fatah:::: mengatakan...

Fantastic.....

Asriadi Blog mengatakan...

Makasih gank infonya... bermanfaat banget...

chairil kaka mengatakan...

mantab hasil karya si mas bro

a-pg blog mengatakan...

makasih gan infonya
izin coba gan

Cah Gembloengz mengatakan...

Berhasil thank you bro...

update harga apapun mengatakan...

makasih gan, ijin copas

Yan Beta mengatakan...

ok tks bgt buat ilmunya gan :D

Harri Pranata mengatakan...

Punyaku ga berhasil..kok gitu ya?

Giesh Shop mengatakan...

info ya

tmpatnya bukan di rancangan atau tata letak untuk tampilan blog yang baru

tapi pada template, lalu edit html

dan succes

ini sama kyk punyaku giesh shop

Anonim mengatakan...

Sudah Saya coba tapi engga berhasil... gimana ya..? maklum saya pemula.

Nununk Syahfitry mengatakan...

makasih bangeetttt kaakk :)

100 DOCUMENT TRIK BUAT MESIN UANG GRATIS 100% GRATISSSS mengatakan...

Your blog posts and articles are very interesting, for me added knowledge, keep your blog so I can visit again to see your blog posts and articles later, thanks for the info

yasin husaeni mengatakan...

ribet massss

A Qudus mengatakan...

gan mau tanyak, kalau pos di halaman kok gak bisa tampil semua yha. ttap readmore, gak bisa di baca lengkap posnya ..... thank....
http://achqudus.blogspot.com

VINKY BLOG mengatakan...

Tipsnya ane coba Sob ,,,

dika putra mengatakan...

terimaksih banyak mas, anda belajar dimanasih tentang template blog?????? hehehe...

visit handikap60.blogspot.com/

abu aufa mengatakan...

makish pak udah kucoba dan 100 % sukses mampir di blog ku yaaaaa Abu-Uswah

Adhiyasa Putra Permana mengatakan...

mampir gan.. adhiiyasa.blogspot.com

Bayu Qreen mengatakan...

thanks sobat.

Visit me ,,,,, " Qreenerszone.blogspot.com

Tutorial Blogspot dan SEO mengatakan...

terima kasih sahabat atas ilmunya yang bermanfaat, semoga sukses selalu

web building management mengatakan...

Makasih bro infonya, di tunggu kedatanngannya ya

Sukualam mengatakan...

sangat membantu untuk newbie seperti saya, maturnuwun!

Yohanlie Hendri Embarun mengatakan...

thank's info nya :) sangat bermanfaat.
di tunggu ya ... => talenta.us

Mbisnis iklan mengatakan...

MAs kalau untuk ikut tab selanjut nya gmna yah.
nihn saya buat read more jdi ikut kena tab ke lain nya.
mas bisa liat di blog saya. http://tokoiklan2.blogspot.com/

Nurul Anawi mengatakan...

thanks infonya, membantu banget buat q yang masih baru

Aldo Firman mengatakan...

ngak bisa gan tolong dibantu . salam kenal
http://aldo-share.blogspot.com

Uswatun Hasanah mengatakan...

cari kode klau gak ada gimana gan?

http://GrosirBrosSurabaya.com

alda rena mengatakan...

terimakasih banyak infonya.. saya izin copas.. :)

abu aufa mengatakan...

maaf mas tanya di luar topik aku tuh pake template sama dengan mas punya tapi komentarnya gak bisa di reply, caranya dimana sih udah banyak cara tapi selalu gak memuaskan, mks atasa jawabanya .Abu-Uswah

Dofollow Social Bookmarking mengatakan...

wah keren gan ijin coba jangan lupa yah submit artikel kalian di Dofollow Social Bookmarking

Nasi Liwet instan 1001 mengatakan...

Keren... trims infonya, ntar saya coba. http://www.nasiliwet1001.com.

taufik karim mengatakan...

tutorial nya sudah aku praktekin dan berhasil...
makasih gan

aji erlanda mengatakan...

nice post..
keren gan boleh di coba...
yg asek juga ada disini..
http://ajiekopites.blogspot.com

rizky-gonline mengatakan...

wah thanks sob ini postnya

Muhammad syafi' mengatakan...

kok tidak berhasil gan,,malah muncul kode2 aneeeh,tidak tulisan artikel yang da di blog.
mohon bantuanya ya disini..

http://ilmu-pendidikanislam.blogspot.com/

Fahri Nuralim mengatakan...

Mantap sekali gan (y)

Blog nya sudah saya follow, jngan lupa follback blog saya ya gan hehe

http://unik86.blogspot.com/

Di tunggu loh gan hehe

Salam kenal :)

Yuli Hidayat mengatakan...

Mantab om...
tuker link yoo...
sekalian sering" main kesini sekalian kasih saran diblog saya
http://pancalanmawut.blogspot.com

Hidayat Firmansyah mengatakan...

Terima kasih Gan! share artikelnya

Cara Membuat Read More mengatakan...

Makasih juragan untuk tutorial cara membuat read more diatas sangat berguna banget buat ane.

Ayostyle.com mengatakan...

Sangat membantu artikelnya.. thanks

nunah mengatakan...

terima kasih atas ilmunya langsung ane praktekkan

She TheKill mengatakan...

info bermanfaat..kebetulan blog saya belum memakai readmore..terimakasih.. di tunggu kunjungannya..terimakasih

Basri Matindas mengatakan...

Mantap tipsnya bro, sangat bermanfaat... berhasil di pasang di Blog saya...Kunjungan balik

http://www.bmatindas.com

Sarah Aminah mengatakan...

makasih banyak :D bantu buat tugas sekolah nih

Muhammad Fazrin mengatakan...

Thank gan infonya bermanfaat banget buat newbie kaya ane :D

El Husaini mengatakan...

ko' ga bisa ya gan?
blog ane tetep ga berubah -_-
http://lightsaber9295.blogspot.com

Proudly by UIN SUSKA RIAU