Membuat Read More Otomatis

Cara Membuat Read More Otomatis Pada Blog. Read More atau Baca Selengkapnya yang tampil pada Home page sebuah blog merupakan penggalan dari postingan atau artikel pada blog tersebut, manfaat dari adanya Read More ini yaitu untuk merapihkan tampilan home page blog kita, dimana pada halaman utama blog akan tampil beberapa postingan yang pendek-pendek yang jumlah postingannya sesuai dengan yang kita inginkan yang sudah kita sesuaikan jumlah tampilan artikelnya pada settingan blog.

Membuat penggalan postingan atau Read More pada Blog ada dua cara yaitu: secara manual dan secara otomatis. Untuk cara manual sudah disediakan oleh Blogger dan ada pada menu halaman ketika kita membuat suatu postingan, dan untuk cara otomatis akan penulis coba uraikan caranya seperti pada pembahasan sekarang ini.

Ok sekarang kita langsung saja pada pembahasan Cara Membuat Read More Otomatis:

• Sebelumnya setting dulu jumlah postingan yang ingin ditampilkan pada halaman utama blog dengan cara masuk ke blogger.com klik pada sub menu Setelan kemudian Pos dan Komentar, kemudian rubah jumlah postingan yang ingin ditampilkan seperti pada gambar di bawah, kemudian Simpan setelan.

• Kemudian kembali lagi pada sub menu blogger, klik Template dan pilih Edit HTML.

• Klik pada kotak Edit HTML tersebut dan cari kode </head> dengan cara tekan Ctrl F kemudian letakan kode dibawah ini 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 = 200; </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>

• Selanjutnya cari kode  <data:post.body/> dan 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>

• Kode <data:post.body/> pada template blog jumlahnya lebih dari satu, bisa dua atau tiga. Ganti kode <data:post.body/> coba dari salah satunya mulai dari yang terakhir.

• Klik Pratinjau Template untuk melihat hasilnya, jika berhasil Simpan Template.

Selamat sekarang blog anda sudah memiliki Read More otomatis pada halaman utama blog anda.....

Sesuaikan angkanya dengan keinginan anda:  
summary_noimg = 250 adalah jumlah karakter yang ditampilkan jika postingan tidak ada gambar. summary_img = 200 adalah jumlah karakter yang ditampilkan jika postingan ada gambar.  
img_thumb_height = 120 adalah tinggi gambar thumbnail.
img_thumb_width = 220 adalah lebar gambar thumbnail.
Baca Selengkapnya bisa di ganti apa saja sesuai keinginan misal Read More.

Sekian tips kali ini tentang Cara Membuat Read More Otomatis Pada Halaman Blog semoga bermanfaat...