Cara Mudah Membuat Read More Otomatis di Blogger

Cara Mudah Membuat Readmore Otomatis di Blogger - Read more bisa menjadi nilai tambah pada suatu blog, ini dikarenakan Read more mempunyai beberapa kelebihan diantaranya :

Membuat tampilan blog lebih elegan, Membuat penasaran para pembaca, Menghemat tempat pada blog

Saat ini sudah banyak tersedia template-template berplatform blogger yang sudah menyediakan auto read more. Bahkan diblogger jugasudah disediakan readmore secara manual yaitu dengan mengklik icon gambar seperti kertas yang disobek. Namun bagi antum yang templatenya masih belum ada auto read morenya dan ingin membuat readmore, kali ini ana akan memberikan cara mudah membuat auto read more dengan thumbnail (gambar). Bagaimana caranya? caranya sangatlah mudah, ikutilah langkah-langkah dibawah ini :

*Note : sebelumnya backup dulu template antum dengan mengklik "download template lengkap"

1. Pilih rancangan > edit HTML > ceklis expand template widget.
2. Cari kode </head>  dengan cara menekan tombol F3 pada keyboard.
3. Copy paste kan kode dibawah ini tepat diatas kode </head>

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 220;
img_thumb_height = 120;
img_thumb_width = 220;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>
</script>

4. Cari kode <data:post.body/> kemudian ganti dengan kode-kode dibawah ini!

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:left'><b>Selengkapnya</b> &#8594; <a expr:href='data:post.url'><data:post.title/></a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

5. Tulisan selengkapnya bisa antum ganti sesuka antum, misalnya dengan "baca selengkapnya" atau "read more" atau tulisan-tulisan lainya sesuai selera antum.

Sekian artikel Cut info yang mengulas "Cara Mudah Membuat Read More Otomatis di Blogger" semoga bermanfaat buat antum. Wassalmu'alaikum.