CARA MEMBUAT "BACA SELENGKAPNYA" SECARA OTOMATIS PADA SETIAP POSTINGAN BLOG

Kali ini saya akan membagi pengetahuan saya tentang cara membuat "read more" atau "baca selengkapnya" secara otomatis pada setiap postingan blog anda. Cara ini digunakan untuk menjadikan tampilan laman menjadi lebih singkat. Berikut langkah-langkahnya:

1. Log in Blogger lalu buka Template
2. Klik tombol cadangan/pulihkan yang terdapat pada ojok kanan halaman lalu pilih Unduh Template Lengkap, kemudian apabila telah selesai   mengunduh, klik Tutup
3. Langkah selanjutnya yaitu pilih Edit HTML
4. Letakkan kursor di dalam kotak editor , kemudian cari kode </head> dengan cara  tekan Ctrl+F dan ketikkan kode tersebut.
5. Kalau sudah ketemu, letakkan kode berikut ini di atas 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>
   
   

6. Sekarang cari kode <data:post.body/> dengan cara Ctrl+F tadi. Cari kode terakhir atau paling akhir lalu ganti kode tersebut dengan kode di bawah 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>Baca 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>

7. Klik Pratinjau Template untuk melihat apakah sudah berhasil. Jika belum berhasil, kembalikan kode seperti semula dengan tekan tombol Ctrl+Z beberapa kali. Lalu cari kembali kode <data:post.body/> diurutan kedua dari yang terakhir, lalu ganti dengan kode pada nomor 6 tadi. Klik Pratinjau Template, apabila sudah berhasil, klik Save Template.
   Anda dapat mengganti "Baca Selengkapnya" dengan kata lain sesuka anda.