auto read more

read more atau baca selengkapnya dalam bahasa indonesia di maksud merupakan suatu efek untuk meringkas postingan yang terbilang panjang. blogger juga sudah menyediakan fasilitas serupa dengan memasang icon "insert jump break" di sisi icon "insert a video" dalam editor potingan terbaru blogger, yang mana kita bisa menentukan letak pangkas postingan atau postingan mana yang akan di ringkas kedalam  format read more secara manual dalam tabs new post blogger. tapi disini kita akan membahas tentang memasang fasilitas "auto read more" link script, version 2.0 (for blogspot) by Anhvo, 2008 silam. yang mungkin akan berguna bila anda tidak menginginkan waktu anda untuk hal diatas dan meringkas postingan panjang anda secara ringkas untuk meringkas read more. ah haha, key... next;

setelah anda memasuki bagian kamar html dari blogger dan membuka kunci "expand widget templates" anda, search code </head> lalu letakan code berikut diatas code </head> lalu save! berikut code yang akan di gunakan,

<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)

(C)2008 by Anhvo

visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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>

jika anda belum keluar dari kamar html blogger, coba teruskan langkah dengan mencari code <data:post.body/> setelah itu, ganti code <data:post.body/> dengan code;

<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>

lalu... save! kembali dan lihat hasil dari anda membaca artikel ini :)

tips :

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)

salam jabat erat.