Cara membuat auto readmore pada blogger

Sahabat blogger seperti janji saya pada posting sebelumnya, saya akan memberikan tips membuat auto readmore pada blogger. Tidak terlalu sulit untuk merubah kode java script pada template anda, yang dibutuhkan hanya keberanian..hehe..karena bisa jadi hasilnya tidak sesuai harapan ( karena kesalahan anda ). Saya bicara hal terburuk yang terjadi, kenapa bisa terjadi ?. Biasanya setiap template ada sedikit perbedaan pada kode java script nya, jadi dibutuhkan ketelitian dan lagi – lagi butuh keberanian. Tapi jangan khawatir,sebelum anda melakukan perubahan kode pada template sebaiknya lakukan Download template lengkap. Sehingga jika terjadi kesalahan anda tinggal upload kembali template yang anda download tadi. Saya rasa itu tak akan tejadi jika anda membaca baik – baik perintahnya, karena turorial ini saya dapat dari raja turorial & coding ” O-OM “. Silakan lihat artikel aslinya disini.

Oke, langsung saja kita mulai yach…

Pertama : Jika anda sudah memasang kode readmore versi lama ( yang manual ). Maka anda harus mengembalikannya seperti awal atau menghapus kode tersebut. Masuk ke halaman EDIT HTMLOke, carilah kode berikut ini.. Dan hapuslah kode yang saya tuliskan tebal

<div class=’post-header-line-1′/>
<div class=’post-body’>
<b:if cond=’data:blog.pageType == “item”‘>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href=’data:post.url’>Readmore</a>
</b:if>
<div style=’clear: both;’/>

Jika sudah jangan lupa disimpan ya. Setelah itu ikuti lagi petunjuk dibawah ini..Masih dalam halaman EDIT HTML cari kode </head>

Copy semua kode berikut ini dan simpan diatas kode </head> dan jangan lupa disimpan.

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

Langkah selanjutnya tetap pada halaman EDIT HTML jangan lupa beri tanda centang pada “Expand widget template” dan cari kode berikut ini.

<data:post.body/>

Lalu ganti kode tersebut dengan kode 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>

SELESAI setelah itu jangan lupa disimpan, sekarang anda bisa lihat hasilnya. Baguuus kaan…….

Oke semoga bisa membantu anda tersenyum melihat hasilnya….happy blogging

Related posts:

1. Cara memasang kotak komentar di blogger
2. Cara menghilangkan angka pada label atau kategori
3. Cara termudah menulis kode HTML pada postingan
4. Templates baru, semangat baru
5. Mengatasi error feedburner pada blog wordpress