Kamis, 03 Mei 2012

Membuat Read More Otomatis


Read more dalam blog sangat berperan penting bagi tampilan halaman depan blog tersebut. Pemasangan read more dapat meringkas kalimat dalam satu postingan yang panjang menjadi lebih pendek. Sehingga, dengan adanya read more yang meringkas tulisan ini dapat membuat halaman depan blog kita menjadi lebih rapi dan nyaman dilihat.

Jika kita memiliki blog yang menggunakan template bawaan dari blogspot, kita tentu tidak akan memiliki template yang dilengkapi fungsi read more di dalamnya. Blogspot memang tidak menyediakan fasilitas read more dalam template blognya. Sehingga, jika kita ingin menggunakan fasilitas read more ini di dalamnya maka kita perlu memasangnya secara manual. Read more memiliki banyak fungsi seperti meringkas tulisan dari sebuah postingan yang muncul di halaman depan blog, meningkatkan pageviews dan durasi berkunjung di blog, hingga manfaat utamanya yaitu membuat tampilan halaman depan blog menjadi lebih ringkas dan rapi ketika dilihat.

Untuk memudahkan dalam proses penggunaannya, kita dapat memasang read more yang bersifat otomatis. Pemasangan read more otomatis ini berbeda dengan read more biasa karena read more otomatis akan meringkas dan melakukan fungsi read more dalam setiap postingan di halaman depan blog kita tanpa perlu memasukan kode HTML tertentu ketika menerbitkan postingan blog secara manual. Sehingga, pemasangan read more otomatis ini tentu lebih mudah dan menguntungkan daripada read more biasa.

Pemasangan read more otomatis di blog ini juga mudah dilakukan. Kita hanya perlu memasukan javascript dan kode lainnya dalam template blog kita. Adapun cara untuk memasang read more di blog selengkapnya adalah sebagai berikut:

  • Pertama, masuk ke dalam akun blogger kita masing-masing.

Klik rancangan.

Klik edit HTML.

Klik expand template widget.

Cari kode berikut.

</head>

Masukan kode berikut di atasnya.

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 300;
summary_img = 170;
img_thumb_height = 150;
img_thumb_width = 250;
</script>
<script src='http://panduanbelajarblog.googlecode.com/files/readmore-otomatis.js' type='text/javascript'/>

Cari kode berikut.

<data:post.body/>

Hapus dan ganti dengan kode di bawah ini.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<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>
<div style='clear: both;'/>
<span style='padding-top:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Read more</b></a></span>
</b:if>
</b:if>

Klik simpan template dan selesai

Matur Sukma Tiang 

Tidak ada komentar: