Cara Membuat Read More Otomatis di Blog

 Setelah.. beberapa kali searching di google "Cara Membuat Read More Otomatis di Blog" , , akhir nya ebsof bisa membuat read more otomatis , banyak tutorial Membuat Read More Otomatis saat searching di google , namun, kebanyakan blog-blog tersebut memberikan tutorial yang source code nya error..(berdasarkan pengalaman ne)

Baik dari segi penulisan source code yang susah untuk di copy, maupun source code yang berantakan.. Karena pada template blognya di dilengkapi fasilitas template penulisan source code minimal menggunakan Blockquote yang keren, sehingga membedakan dari source kode dan penulisan biasa. , (untuk cara mengubah Blockquote bisa anda baca artikel Cara Mengubah Tampilan Blockquote )...membuat orang yang membutuhkan user sulit untuk memahami tutorial yang di berikan ...dan mengambil source codenya.. Hem.. apa lagi yang gak tau code sama sekali...

Baiklah.. Simak Tutorial "Cara Membuat Read More Otomatis di Blog" versi Ebosf..

1. Login ke akun blog sobat
2. Pilih Template >> Edit HTML>> Centang Expand Widget Template
3. Penting >> Bakup Terlebih Dahulu Templatenya

4. Cari code </head> , gunakan CTRL+F pada keyboard supaya cepat
5. Setelah ketemu, Copy code di bawah ini tepat 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)

(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. Setelah dijumpai kode di atas.. hapus, dan ganti dengan kode di bawah ini :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span style='float:right'><a expr:href='data:post.url'>Baca Selengkapnya ...</a></span>
<b:else/>
<data:post.body/>
</b:if>

8. Simpan Template anda, Untuk Hasilnya.. sama seperti yang saya gunakan pada template ini

Demikianlah artikel "Cara Membuat Read More Otomatis di Blog" semoga bermanfaat