Cara Membuat Readmore di Blogger

Karena saya ingin mempunyai blog yang ringkas, maka saya tidak ingin di home terlihat postingan saya memanjang hingga selesai 1 halaman, terihat berantakan, maka saya siasati dengan readmore.

Caranya mudah, jika anda sudah terbiasa "bermain2" dengan HTML yang ada di blogger, langsung saja kita lakukan :

1. Log in ke blogger kawan2.
2. Disini saya prektekan dengan blogger tampilan baru, klik "setting" lalu "Template".

3. Klik "Edit HTML", pilih "Procced" untuk masuk ke lembar HTML.
4. Centang "Expand Widget Templates".
5. Cari kode </head> bisa dengan : ctrl + F.
6. Lalu masukkan code di bawah ini tepat di atas  </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>

7. Kemudian sobat  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;padding-top:20px;'>

<a expr:href='data:post.url'> <b> readmore</b> &#187;&#187;&#160;&#160; </a></span>

</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>

</b:if>

 8. Klik "Save Template", maka postingan anda secara otomatis akan diringkas serta tentu saja ada readmore...

Sekian tips dari saya semoga membantu kawan2.