Minggu, 19 Agustus 2012
Sudah lama saya tidak posting nih hehee. Okelah sekarang saya akan share Cara Membuat Read More Otomatis. Memang sih cara ini sudah banyak di share, tapi saya akan share kembali biar tidak padam :D
Berikut cara caranya :
- Masuk ke blogger anda
- Pilih template, lalu edit HTML
- Jangan lupa centang Expand Template Widget
- Kemudian cari kode </head> dengan CTRL+F
- Kemudian copy kode dibawah ini tepat diatas kode tadi
<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 (for blogspot)
(C) 2010 Ngulik-Blog.com
visit http://www.Ngulik-Blog.com/
**/
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>
- Kemudian cari kode <data:post.body/>
- Hapus kodenya lalu ganti 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'><b>Baca Selengkapnya</b> →<data:post.title/></a></span></b:if><b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
- Kemudian simpan :)
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)
- Baca Selengkapnya (bisa anda ganti dengan selera anda maupun dengan gambar)
- <data:post.title/> (ini adalah judul postingan dan tidak boleh diganti)
OKE SELAMAT MENCOBA
