Sabtu, 14 Agustus 2010

Membuat Auto Readmore (read More Otomatis)

Auto read more berguna untuk memenggal posting atau artikel agar tidak ditampilkan semua,jadi hanya beberapa paragraf saja yang ditampilkan di halaman utama dan ini berguna agar beberapa postingan bisa ditampilkan sekaligus dihalaman utama tapi hanya beberapa paragraf saja dari masing-masing posting.
Jika pengen pasang read more otomatis seperti blog ini,ikuti cara berikut:
  • Login ke blogger pilih tata letak/layout.
  • Klik edit HTML
  • Cari kode </head> , copy script dibawah ini letakkan persis diatas </head> kode tadi.

<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>
  • jangan lupa
    disimpan.

  • Masih di edit
    HTML centang "Expand widget template" lalu cari kode 
    <data:post.body/>
  • Kalo sudah ketemu
    ganti kode
    <data:post.body/> dengan script
    berikut 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>
  • jangan lupa
    disimpan lagi.Selamat mencoba.

    Semoga artikel ini bermanfaat, jangan lupa sering berkunjung ke blog saya. OK

0 Comments
Tweets
Komentar

0 komentar:

Leave a Comment

Klik Iklannya Donk