Cara membuat readmore otomatis dengan gambar

Silahkan buka template anda. Pilih: TEMPLATE >> EDIT.

Cari Kode </head>.

Copy paste kode dibawah ini tepat di atas kode </head>

<!ReadMorehttp://trikseosimple.blogspot.com>

<b:ifcond='data:blog.pageType!=&quot;static_page&quot;'>
<b:ifcond='data:blog.pageType!=&quot;item&quot;'>
<style>
.postbody{textalign:justify;}
.postbodyimg{maxwidth:none;width:auto;}
.readmore{float:left;paddingtop:10px;}
.readmorea{color:#fff!important;textshadow:01px0
rgba(0,0,0,0.5);background:#0457A9;textdecoration:none;font:bold13px
Arial;padding:5px;}
.readmorea:hover{textdecoration:none;background:#666;}
.pic{border:10pxsolid#fff;float:left;height:165px;width:250px;marginright:20px;margin
bottom:10px;overflow:hidden;boxshadow:5px5px5px#111;}
.growimg{height:165px;width:250px;transition:all2sease;}
.growimg:hover{width:400px;height:250px;}
</style>
<scripttype='text/javascript'>
varthumbnail_mode=&quot;yes&quot;;//yesdengangambar,notanpagambar
summary_noimg=300;//banyaknyahurufjikatidakadagambar
summary_img=250;//banyaknyahurufjikaadagambar
img_thumb_height=165;
img_thumb_width=250;
</script>
<scripttype='text/javascript'>//<![CDATA[
functionremoveHtmlTag(strx,chop){if(strx.indexOf("<")!=1){vars=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.length1)?chop:strx.length
2;while(strx.charAt(chop1)!=''&&strx.indexOf('',chop)!=1)chop++;strx=
strx.substring(0,chop1);returnstrx+'...';}functioncreateSummaryAndThumb(pID){vardiv=
document.getElementById(pID);varimgtag="";varimg=
div.getElementsByTagName("img");varsumm=summary_noimg;if(thumbnail_mode==
"yes"){if(img.length>=1){imgtag='<divclass="growpic"><imgsrc="'+img[0].src+'"
width="'+img_thumb_width+'px"height="'+img_thumb_height+'px"/></div>';summ=
summary_img;}}varsummary=imgtag+'<div>'+removeHtmlTag(div.innerHTML,summ)
+'</div>';div.innerHTML=summary;}
//]]></script>
</b:if>
</b:if>
<!AutoReadMoreAkhir>

Save Template anda.

Kemudian scroll template anda kebawah cari kode seperti berikut:

Ket: Kata kuncinya adalah didalam kotak hitam "BLOG POSTS / POSTINGAN BLOG" jika
anda menggunakan bahasa indonesia.

Jika suda menemukan kode seperti gambar di atas silahkan klik anda panah kecil
warna hitam sebelah kiri.

Setelah tanda panah kecil di klik maka akan ada tampilan seprti gambar berikut

Cari kode yang di tandai dengan kotak hitam. "POST' VAR='POST'".

Setelah ketemu klik tanda panah yang lurus dengan kode tersebut.

selanjutnya akan terbuka kode kode yang lain.

geser atau scrol ke bawah dan cari kode

<data:post.body/>
Setelah ketemu hapus kode diatas dan ganti dengan kode dibawah ini:

<!AutoreadmoreMulai>
<b:ifcond='data:blog.pageType==&quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:ifcond='data:blog.pageType==&quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<divexpr:id='&quot;summary&quot;+data:post.id'><data:post.body/></div>
<scripttype='text/javascript'>
createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<divclass='readmore'>
<aexpr:href='data:post.url'>BacaSelengkapnya&#187;</a>
</div>
</b:if>
</b:if>
<!AutoreadmoreAkhir>

Klik SAVE / SIMPAN dan lihat hasilnya.

Terlihat seperti sulit tetapi jika sambil di praktekan pasti bisa karena ini sudah sangat detail,
jika saya menjelaskan dengan singkat mungkin para blogger pemula tidak akan mengerti atau
kesusahan membuatnya.

sekian dulu sari saya untuk cara membuat readmore semoga bermanfaat dan jika masih ada
yang tidak dimengerti anda dipersilahkan untuk bertanya langsung.