Tutorial blogspot, belajar blog, membuat html dasar, perbaiki template,Tutorial Blog, HTML, Cara membuat, attribution blog, warna html,css kode

Rabu, 14 September 2011

Cara membuat readmore (baca selengkapnya) secara otomatis

Langsung aja ga perlu basa-basi.
Sebelum anda mencoba trik ini, ada baiknya anda membackup template anda terlebih dahulu, caranya :
1. Klik menu Design
2. Pilih menu Edit HTML
3. Klik Download Full Template

Langkah - langkah Membuat Readmore otomatis sebagai berikut :
1. Pergi ke menu Design, lalu klik Edit HTML.
2. Centang " Expand Widget Template ".
2. Lalu cari </head>, Tekan CTRL+F untuk memudahkan pencarian.
3. Copy kode dibawah ini dengan tepat dibawah 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)

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


4. Masih pada menu Edit Html cari lagi kode berikut : <data:post.body/>
ingat, gunakan CTRL+F untuk memudahkan pencarian.

5. Apabila telah dicari ganti kode <data:post.body/> tersebut 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>


6. Klik Save Template dan lihat hasilnya,

7. Jika ini tidak berhasil,brarti Anda belum bruntung :D

Share on Facebook
Share on Twitter
Share on Google+
Tags :

Related : Cara membuat readmore (baca selengkapnya) secara otomatis

5 komentar:

  1. It's work fren .. makasai banyak y ..

    BalasHapus
  2. thank ya infonya, berguna banget

    BalasHapus
  3. Disi Sundusi@ Thanks kembali gan..semoga bermanfaat.

    BalasHapus