Nah pada postingan kali ini saya sudah mempunyai kodenya supaya read more otomatis berjalan sesuai yang kita harapkan tanpa menggangu halaman statis atau static page kita. Okelah tidak usah panjang lebar lagi. Langkah-langkahnya adalah sebagai berikut:
1.Login ke akun bloggersobat
2.Pilih Templatelalu Edit Html, Jangan lupa centang Expand Template widget
3.Taruh kode di bawah ini di atas kode </head> untuk mempermudah pencarian tekan ctrl+f di keyboard sobat
<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; 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>
4.Kemudian cari kode ini <data:post.body/> untuk mempermudah pencarian tekan ctrl+f di keyboard sobat
5.Kemudian hapus kode <data:post.body/> dan ganti dengan kode di bawah ini
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<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='more' style='float:left'>
<a expr:href='data:post.url'>Read more</a>
</span>
</b:if> </b:if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
</b:if>
6.Simpan Template dan lihat hasilnya
7.Selesai
Keterangan :
summary_noimg = 430; Menentukan jumlah ringkasan tanpa gambar
summary_img = 340; Menentukan jumlah ringkasan dengan gambar
img_thumb_height = 100; kode ini untuk tinggi gambar thumbnailnya
img_thumb_width = 120; kode ini untuk lebar gambar thumbnailnya
Read more = Bisa di ganti tulisan yang lain, misalnya: Baca selengkapnya, Baca selanjutnya, Baca terusannya
Kini blog sobat kelihatan lebih indah. Sekian postingan ini. Semoga bermanfaat
Backlinks Please Thanks
URL |
Code For Forum |
HTML Code |