Memasang Auto Read More

Pada postingan yang lalu telah dibahas cara membuat read more, tapi untuk kali ini gimana cara membuat read more otomatis, jadi Anda tidak perlu lagi repot-repot menulis atau mengatur postingan diantara kode <div class="fullpost">.............&lt/div;> . Anda tinggal tulis postingan dan publikasikan maka otomatis akan tampil read more.

Untuk melihat contoh read more otomatis klik disini

Langsung saja copy kode dibawah ini dan letakkan di atas kode </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>

Cari kode <data:post.body/> kalu sudah ketemu,... belum ketemu ? Yaa, untuk lebih cepat tekan Ctrl + F lalu masukkan kode <data:post.body/> dalam kotak kecil di kiri bawah tekan enter. Nah... ketemu kan, kemudian ganti kode tersebut dengan kode dibawah 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'>&#187;&#187;&#160;&#160;read more</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
</b:if>

Simpan template dan lihat hasilnya, kalau pingin tahu contoh blog yang menggunakan auto read more klik disini.

Op! hanpir lupa kalo template Anda sudah ada read more yang manual Anda harus merubah ke aslinya terlebih dulu, caranya lihat kode dibawah ini dan hapus yang berwarna merah.

<div class='post-header-line-1'/>
<div class='post-body'>
<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>
<a expr:href='data:post.url'>readmore</a>
</b:if>
<div style='clear: both;'/>

OK! Selamat mencoba.