Cara Membuat Auto Read More Pada Blog

Pada kesempatan kali ini saya mau menjelaskan bagaimana cara membuat auto readmore, cara membuat continue reading, cara membuat baca selengkapnya atau cara membuat lanjutkan membaca pada blog, nah buat sahabat yang blognya belum memakai auto readmore silahkan lihat di bawah ini untuk caranya.


  • Pastinya sahabat sudah login di blog sahabat
  • Pilih/Klik Template
  • Pilih Edit HTML centang Expand Template Widget (jangan lupa download dulu template untuk jaga-jaga bila ada kesalahan)
  • Setelah itu cari kode </head> dan letakkan kode dibawah ini di atas nya.

<!-- Auto Read More by yandyndy.blogspot.com- Start -->
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
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>
<!-- Auto Read More by yandyndy.blogspot.com- End -->

  • Setelah itu cari lagi kode <data:post.body/> lalu hapus kode tersebut dan ganti dengan kode di bawah ini.

<!-- Auto Read More by yandyndy.blogspot.com- Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id' style='text-align:justify;'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<a class='more' expr:href='data:post.url'>Lanjutkan Membaca</a>
</b:if>
</b:if>
<!-- Auto Read More by yandyndy.blogspot.com- End -->


 *NB: Tulisan yang saya beri tanda warna merah bisa kalian ganti sesuai keinginan kalian.
  • Terakhir Save Template dan lihat hasilanya. Selamat Mencoba.

1 komentar:

:a: :b: :c: :d: :e: :f: :g: :h: :i: :j: :k: :l: :m: :n: :)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} ~x( :-t b-( :-L x( =))

Tinggalkan jejak Sahabat di Bawah ini. Buat Sahabat yang Mempunyai Blog Insya allah saya kunjungi Balik