Kali ini saya akan share tentang cara membuat "READ MORE" pada posting blog kamu. Mungkin sobat Blogger semua bingung bagaimana sich cara Mempersingkat atau Memperpanjang serta Memperpendek Postingan Pada Halaman awal Blogger? Nah caranya dengan memasang Read More pada Blog disini juga Anda bisa mengatur Tinggi dan pendeknya Postingan anda Pada halaman awal Blog anda. Langsung saja ini saya akan beri Tips Cara Mengatur Postingan Pada Halaman Blog :
1. Login Pada Blogger Anda
2.Pilih Design/Template lanjut ke Edit HTML
3.Centang Expand Template Widget
4.Tekan CTRL + F dan kemudian Cari kode </head>
5.Copy script dibawah ini diatas 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[
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.Kemudian cari lagi kode <data:post.body/>
<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 == "item"'><data:post.body/></b:if>
8.Oke done dch langkah-langkahnya yang terakhir klik Save template,, and check out hasilnya di blog kamu
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)
Sekedar tambahan untuk memudahkan anda bereksperimen menggunakan cara yang satu ini sebaiknya anda Download Template anda terlebih dahulu untuk menetralisir kesalahan.Terkadang anda yang sudah menggunakanReadMore Pada Blog anda menemukan kode
