Cara membuat Read more otomatis + judul postingan

Halo ......sobat blogger kemarin saya mencoba membuat read more tapi gagal-gagal mulu tapi sekarang saya sudah bisa membuat read more berhasil ,karna berhasil saya membuat artikel ini sobat mau tau kan kaya apa read more yang saya buat




Sebelum saya menjelaskan readmore sebenarnya saya buat emmm mungkin kalau blog akan terlihan rapih dan terkesan gimaaaaaanaaaa giiituuu jadi yaaaa saya buat aja hahaha dah ya ,daripada ngomong mulu nihh cekidot:



Caranya gampang sekali sobat
pertama sobat harus punya blog dolu kalo gak punya bisa daftar disini
2.)Login akun blogger sobat
3.)pergi ke rancangan>edit HTML>ceklist (Expand Template Winget)
4.)Cari kode

</head> 

lalu copy-paste code dibawah ini tepat sebelum 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>

5.)Masih di edit HTML selanjutnya sobat
cari kode

<data:post.body/> 

lalu ganti kode tersebut dengan script 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.)SELESAI simpan template dan lihat hasilnya

Keterangan:

Tulisan yang bercetak tebal bisa diganti dengan selera sobat

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)

Tutorial ini berdasarkan o-om.com dengan sedikit perubahan bahasa penyampaian jika sobat ingun membaca artikel nya secara lansung kunjungi o-om.com
 Walaupun readmore saya sudah acak-acakan tetapi artikel ini menyempurnaan ,harap maklum oke..........

SEKIAN DAN TERIMAKASIH TERUS BERKARYA

SELAMAT MENCOBA DAN SEMOGA BERHASIL

Anda suka dengan postingan saya ,anda bisa mengcopy nya akan tetapi saya mohon cantumkan link sumbernya ,oke...... terimakasih