Read more otomatis (Automatic Read more ) adalah read more atau
baca selengkapnya dengan secara otomatis mengambil ringkasan dari
blog kita di tambah lagi read more otomatis ini juga akan mengambil gambar thumbnailnya.
Berikut cara pasang readmore otomatis di blog kamu :
Langkah Pertama:
Pergi Ke TATA LETAK - EDIT HTML (sebelum mengedit HTML sebaiknya backup dulu template anda)
Langkah Dua:
Beri tanda centang pada Expand Template Widget
Langkah Tiga :
Copy-paste kode javascript berikut tepat diatas kode
</head>
<script type='text/javascript'> var thumbnail_mode = "no-float" ; 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>
Langkah Empat :
Temukan kode
<data:post.body/> gunakan CTRL + F pada Browser anda.
Langkah Lima :
Ganti kode (langkah empat) tersebut dengan cara menghapus kode
<data:post.body/> dengan yang berikut
<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:right;padding-top:20px;'>
<a expr:href='data:post.url'>»»  read more</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/>
</b:if>
Langkah Enam:
Save Template - Selesai
Trik kode Javascript ini dari
Kang Jaloe dan
blogtemplate4u
Penjelasan Langkah Ketiga :
Kita dapat mengatur nilai value kode berikut sesuai dengan kebutuhan
summary noimg= 430 – tinggi artikel terpenggal tanpa image
summary img=340 – tinggi artikel terpenggal dengan image
Bagi Yang Telah Memiliki Readmore versi Lama :
Bagi Yang Telah memiliki Readmore versi lama sebaiknya kodenya dikembalikan dulu seperti semula. Caranya dengan menghapus kode berwarna merah (setiap template mungkin berbeda, jadi tinggal disesuaikan saja).
<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;'/>
SELAMAT MENCOBA :)
READ MORE - Read More Otomatis Buat Blog Kamu :)