Sabtu, 12 Mei 2012

Cara Membuat Auto Read More di Blog


Read More merupakan tombol yang digunakan untuk mempersingkat tampilan sebuah artikel. Ada 2 cara untuk membuat tombol ini, yaitu secara manual dan secara auto/otomatis.
Untuk secara manual, kita harus selalu memasukkan sebuah kode html pada postingan, jika hanya beberapa postingan tidak terlalu bermasalah, tapi bagaimana jika yang ingin diberikan tombol read more ada ratusan. Sudah terbayang bukan susahnya. 
Untuk secara auto/otomatis, kita hanya harus melakukan beberapa langkah di bawah ini;

  • Tentu saja login terlebih dahulu ke blogger
  • Klik Rancangan kemudian klik Edit html, jangan lupa conteng Expand Widget Templates.
  • Lalu cari kode </head> pada susunan kode html, tekan Ctrl + F untuk lebih cepat menemukan kode tsb.
  • Setelah ketemu letakkan kode ini tepat dibawah/setelah kode </head>

<script type='text/javascript'> var
thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430;
summary_img = 340; img_thumb_height = 100; img_thumb_width = 120;
</script> <script
src='http://projectloss.googlecode.com/files/read-moreotomatis.js'
type='text/javascript'/>


  • Cari lagi kode  <data:post.body/> atau <p><data:post.body/></p> 
  • Setelah melihat salah satu dari kode di atas, hapus kode tersebut ( <data:post.body/> atau <p><data:post.body/></p> ) kemudian ganti dengan kode berikut
<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:right;padding-top:20px;'><a expr:href='data:post.url'>[Read More..]</a></span></b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/><br/> </b:if>

  • Simpan... Dan lihat hasilnya 

    Tidak ada komentar:

    Posting Komentar

    Related Posts Plugin for WordPress, Blogger...