Memasang auto Read More

Temen-temen, kalo dipikir-pikir pakai fitur read more manual ribet juga ya..nah, blognya ipank mau bagi tips memasang auto read more. kelebihan pakai fitur ini, kalian tidak perlu lagi memasukan kode <span id="fullpost"> lagi seperti fitur read more sebelumnya. nantinya fitur ini secara otomatis akan memotong postingan setelah beberapa karakter sesuai settingan atau pengaturan. jadi kamu bisa mengatur banyaknya karakter yang akan dipotong. selain itu, fitur ini juga akan menampilkan gambar pertama dalam postinganmu secara otomatis.

Langsung aja ke cara buat read more otomatis pada blog.
sebelumnya, buat kalian yang sudah terlanjur masang fitur read more lama atau yang manual. kalian cari kode di bawah ini dulu Tata Letak, Edit HTML:

<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>




<p><data:post.body/></p>




<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

Ganti semua kode yang berwarna merah di atas dengan kode berikut :

<div class='post-body entry-content'>


<p><data:post.body/></p>

Tutorial Pemasangan
1. Menu Dashboard, klik Tata Letak, klik Edit HTML.
2. Centangin checkbox Expand Widget Template.
3. copy paste kode berikut ini sebelum atau 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>
//<![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. Cari kode <p><data:post.body/></p> lalu ganti dengan kode berikut :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<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...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

5. klik Simpan.

Selesai sudah cara pasang auto read more pada blognya.hehe.Untuk keterangan setting, lihat petunjuk di bawah ini:
summary_noimg = 250; menentukan jumlah karakter sebelum dipotong apabila postingan tanpa gambar.
summary_img = 250; menentukan jumlah karakter sebelum dipotong apabila postingan dengan gambar.
img_thumb_height = 120; menentukan tinggi gambar(dalam ukuran pixel)
img_thumb_width = 120; menentukan lebar gambar(dalam ukuran pixel)

Kalian juga bisa mengganti tulisan read more dengan gambar. caranya lihat petunjuk di bawah ini :

Pada langkah ke-4, tulisan Read More... kalian ganti dengan kode berikut:

&lt;img src="URL GAMBAR"&gt;

Selamat Mencoba.