Membuat Auto Read More Dengan Menggunakan Button

  Tutorial kali ini saya membahas bagaimana membuat read more tombol di dalam blog, Ya walaupun sudah banyak yang punya seh......, Tapi gak salah juga kan kalian - kalian semua mencobanya ? 100% berjalan dengan mulus . So, Mari Kita Mulai Langkah-Langkah Membuat Auto Read More dengan Button.

1. Login >> Rancangan >> Edit HTML >> Expand Template Widget
2. Cari Kode </head> letakkan kode berikut di atas kode </head>

<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 Script with Action Button

(C)2010 by Nhiecotine21

visit http://nhiecotine21011989.blogspot.com
********************************************/
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>

3. Lalu cari kode <data:post.body/> ganti kode <data:post.body/> dengan kode di bawah 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'><a expr:href='data:post.url'><img alt='http://www.iconspedia.com/uploads/12789365491822702177.png' src='http://www.iconspedia.com/uploads/12789365491822702177.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Selamat Mencoba...!!! Jangan Lupa Tinggalkan Jejak di Bawah ya gan..!!! utamakan Blogger Comment