membuat read more di blog dengan cara mudah

Cara Memasang Read More Otomatis

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 == "item"'><data:post.body/></b:if>

10. Simpan Template

Selesai Deh..

Keterangan:
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 dan jangan lupa comment

Mungkin yang anda Cari:

turorial blog

Tidak ada komentar:

Posting Komentar

CARA DOWNLOAD :

Klik Link Download/Adf.ly
Tunggu 5 Detik
Klik Kanan Tulisan Skip Ad (bukan klik kiri)
Pilih Copy URL/Link
Paste di Browser > Enter

NB : Skip Ad di klik kanan yah bukan diklik kiri yang seperti biasanya
: Adfly sedang tidak rukun dengan mediafire

Tulis "kolursari DX" di google jika kamu lupa blog ini.

Selasa, 08 November 2011