Membuat Auto Read More

Membuat Auto Read More | Tutorial Blog

Auto Read More adalah opsi yang otomatis memotong artikel Sobat saat di tampilkan pada home page blog Anda. Auto Read More ini dilengkapi dengan pengaturan jumlah karakter, Ada 2 pengaturan jumlah karakter yaitu jumlah karakter Read More tanpa gambar dan jumlah karakter Read More dengan gambar.

Berikut cara membuat auto read more :

1. Login ke akun Blogger Sobat, klik Design / Rancangan  > Edit HTML.
   Penting!!! Biasakan men-Download / membackup template blog Anda sebelum mengedit template.
2. Beri tanda centang pada Expand widget template, kemudian letakkan kode berikut ini di atas kode </head> (tekan Ctrl+F untuk mempermudah dalam pencarian kode)
   <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>
   Anda juga dapat merubah kode berikut:
   var thumbnail_mode = "float";
   summary_noimg = 250;
   summary_img = 250;
   img_thumb_height = 120;
   img_thumb_width = 120;
   Ganti angka pada summary_noimg untuk mengatur jumlah karakter yang tampil pada kutipan artikel tanpa gambar.
   Ganti angka pada summary_img untuk mengatur jumlah karakter yang tampil pada kutipan artikel dengan gambar.
   Ganti angka pada img_thumb_height untuk mengatur tinggi gambar yang tampil pada kutipan artikel.
   Ganti angka pada img_thumb_width untuk mengatur lebar gambar yang tampil pada kutipan artikel.
3. Selanjutnya cari kode <data:post.body> lalu ganti dengan kode ini;
         <b:if cond='data:blog.pageType != &quot;item&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'><a expr:href='data:post.url'><b>More about</b> &#8594;</a></span>
   </b:if>
Ganti kata left dengan right untuk menampilkan link readmore di bagian kanan.
Ganti kata More about dengan kata yang Anda inginkan. Misalnya Read More,Baca Selengkapnya, Selanjutnya atau Seterusnya.
4. Terakhir klik Pratinjau / Preview untuk melihat hasilnya. Jika Anda rasa sudah sesuai, klik tombol Simpan / Save Template.

Catatan : Jika Sobat menggunakan opsi ini, Artikel pada halaman juga akan terpotong.

Semoga tutorial ini bisa berguna buat sobat yang ingin Membuat Auto Read More.