Cara Membuat Widget Read More Otomatis Di Blogspot
Nah,
untuk memasang widget read more ini pun tidak terlalu sulit. Seperti
biasa, sobat harus melakukan Login di Blogger,kemudian pilih menu
Template.
Setelah ketemu, ganti kode tersebut dengan kode script di bawah :
<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>
</head>
Langkah selanjutnya adalah cari kode <data:post.body/>, lalu ganti kode tersebut dengan kode yang ada di bawah ini. Perhatikan, kode script <data:post.body/> dalam sebuah template, mungkin terdapat dua atau tiga buah kode script yang seperti ini. Sobat bisa mencoba untuk mengganti secara satu persatu. Dan pada template blog yang ini, kode scrip <data:post.body/> yang saya gantikan adalah yang kedua.
<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'> <b> readmore</b> »»   </a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/>
</b:if>
Setelah
selesai, sobat bisa mencoba mengklik Pratinjau untuk melihat hasil
editannya. Dan jika berhasil, sobat bisa menyimpan hasil editannya
dengan mengklik Simpan Template. Selamat mencoba dan semoga berhasil.
Selamat mencoba
