Postingan kali ini saya akan memberikan solusi ketika para blogger tidak berhasil mengaplikasikan Cara membuat auto readmore pada blog
yang pertama. Pembuatan auto readmore kali ini adalah teknik yang hampir berhasil dipraktekkan pada semua template. Jika anda ingin mencobanya, berikut tutorialnya:

1. Login ke blog anda >> klik template >> edit HTML >> lanjutkan >> jangan lupa centang expand template

2. Tekan CTRL + F lalu cari kode berikut </head>

3. Jika sudah ketemu copi paste-kan kode berikut di atas kode no. 2


<script type='text/javascript'> var thumbnail_mode = "float" ; summary_noimg = 250; summary_img = 250; img_thumb_height = 120; img_thumb_width = 120; </script> <script type='text/javascript'> //<![CDATA[ /****************************************** Auto-readmore link script, version 2.0 (for blogspot) (C)2008 by Anhvo visit http://en.vietwebguide.com to get more cool hacks ********************************************/ 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>


4. Setelah berhasil cari kode berikut  <data:post.body/>

5. Ganti kode no. 4 itu dengan kode di bawah ini


<b:if cond='data:blog.pageType != "item"'> <div expr:id='"summary" + data:post.id'> <data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script> <span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span> </b:if> <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

NB.
var thumbnail_mode = "float" kode itu untuk menampilkan tampilan readmore berada di kanan atau di kiri
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
 summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel)

silahkan keterangan kode di atas blogger ubah sesuai selera dan eksperimen

6. Proses terakhir save template dan lihat blog anda , semoga berhasil.