Membuat Read More Di Blog

Tau Read More gak? sedikit penjelasan dari saya
read more itu dalam istilah lain Jump Break yang berfungsi menyingkat post kita pada halaman Home Page agar tidak terlalu panjang. karena post yang panjang dapat mempengaruhi kecepatan blog kita. yauda yang mau masang read more otomatis ikuti langkah - langkah di bawah ini..

1. Login pada blog anda

2. Rancangan

3. Edit HTML

4. Download dulu templatenya biar gak terjadi hal - hal yang tidak diinginkan dengan cara mengklik Download Template Lengkap

5. Centang kotak kecil di ujung script box Expand Widget Template

6. Cari kode </head> untuk mempermudah pencarian klik ctrl + f pada keyboard

7. Pastekan kode dibawah ini 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 link script, version 2.0 (for blogspot)



********************************************/

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>

8. Selanjutnya cari kode <data:post.body>
9. Ganti kode <data:post.body> dengan kode dibawah ini

<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:left'><a
expr:href='data:post.url'>READ MORE -
<data:post.title/></a></span>


</b:if>

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

10. Simpan Template



Notification:
var thumbnail_mode = "float"; (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel)

Selamat Mencoba !!