Join Us !!
Senin, 24 Desember 2012

Cara membuat read more otomatis tanpa mengganggu halaman statis

0 komentar
Read More → Cara membuat readmore otomatis banyak sekali di jumpai di mesin pencari seperti Google, namun setelah saya selidiki ternyata banyak sekali yang kurang maksimal, kekurangannya adalah jika kita memasang read more otomatis di blog kita, maka halaman statis atau static page kita ikut terkena read more otomatis, padahal halaman statis atau static page kita kan tidak perlu di pasang readmore otomatis.

auto readmore


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 = &quot;no-float&quot; ; 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
Anda Baru Saja Membaca Artikel Tentang Cara membuat read more otomatis tanpa mengganggu halaman statis ,Anda Boleh Menyebarluaskan / Mengcopy Paste Artikel Cara membuat read more otomatis tanpa mengganggu halaman statis Ini Bermanfaat Buat Anda , Namun Saya Mohon Untuk Mencantumkan Link Cara membuat read more otomatis tanpa mengganggu halaman statis Sebagai SumberNya.

Leave a Reply