Memasang Read More ( baca selengkapnya ) Otomatis

Pada postingan kali ini akan dibahas tentang cara membuat readmore otomatis. Guna read more ini yaitu menyingkat postingan kita sehingga blog kita terlihat rapih.

Langkah-langkahnya :

1. Masuk ke akun blog sobat. Untuk berjaga-jaga sebaiknya sobat klik Download Template Lengkap terlebih dahulu jikalau ada kesalahan, template sobat dapat dibackup.

2. Klik Rancangan.

3. Klik Edit HTML.

4. Centang kotak Expand Template Widget kemudian cari kode </head>. Untuk mempermudah pencarian tekan ctrl+f.

5. Copy kode dibawah ini kemudian pastekan diatas kode </head>.

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 450; summary_img = 360; img_thumb_height = 120; img_thumb_width = 150; </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>

6. Selanjutnya cari kode <data:post.body/> atau <p><data:post.body/></p>.

7. Hapus kode <data:post.body/> atau <p><data:post.body/></p> dan ganti 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>

8. Klik Simpan Template.

selamat mencoba, jangan lupa tigalkan komentar yaa

Free Template Blogger collection template Hot Deals BERITA_wongANteng SEO theproperty-developer