Spiga

Membuat Readmore | Baca selengkapnya di Blogspot

Readmore/baca selengkapnya adalah fasilitas yang dapat kita gunakan untuk memberikan tampilan postingan secara pendek, dan untuk dapat membaca artikel/postingan secara penuh harus meng-klik link "Readmore.." atau "Selengkapnya.." atau apalah tergantung selera masing-masing. Mengingat di blogspot tidak menyediakan fitur untuk membuat ini secara otomatis seperti di WordPress, maka harus melakukan sedikit editing/oprekan pada templatenya agar bisa menggunakan fasilitas ini.

Seperti kita ketahui, postingan yang ada di blogspot akan ditampilkan secara penuh pada halaman itu juga, ini memberikan kesan tampilan yang tidak begitu "manis", misalnya pada halaman Home/Homepage kita akan menampilkan 10 postingan maka keseluruhan postingan akan ditampilkan sehingga halaman akan memanjang kebawah sepanjang postingan tersebut.

Nah agar tampilan halaman home tidak seperti itu maka diperlukan trik readmore/baca selengkapnya sehingga postingan yang ditampilkan di halaman depan hanya potongannya saja dan postingan secara penuh dapat dilihat dengan meng-klik readmore/baca selengkapnya/selengkapnya (tergantung selera :p) seperti yang sudah saya jelaskan diatas. Untuk membuatnya ada dua langkah yang harus kita lakukan yaitu dibagian Template dan dibagian Setting. Silahkan simak tulisan dibawah ini:

A. Pengaturan di Template?
1. Setelah login di blogger denga akun Anda, masuklah ke tab menu "Layout" kemudian pilih "Edit HTML".
2. Jangan lupa "tik" menu checkbox "expand widget template".
3. Carilah kode dibawah ini:

<p><data:post.body/></p>



4. Setelah ketemu, hapus dan ganti dengan kode dibawah ini:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'> <strong>Selengkapnya...</strong></a> </p>
</b:if>



--> tulisan "Selengkapnya" bisa diganti sesuai selera...
5. Setelah selesai, jangan lupa disimpan.

B. Di bagian Setting/Pengaturan?
1. Pilih tab menu setting (atau pengaturan jika menggunakan bahasa Indonesai)
2. Kemudian pilih Formatting/Format
3. Dibagian paling bawah terdapat kotak kosonga, disamping label menu "Template Posting", isi kotak tersebut dengan kode dibawah ini:

<span class="fullpost">

</span>



4. Jangan lupa disimpan.

C. Perhatikan! Cara memposting berbeda!
1. Untuk memposting tulisan/artikel ada perbedaan dengan kalau kita tidak menggunakan readmore.
2. Ketika memposting, pilih tab menu "Edit Html" bukan "Compose" (sebaiknya mulai sekarang lupakan posting lewat compose jika Anda tidak begitu paham HTML). Perbedaannya adalah Compose mempunyai fungsi WYSIWYG(What You See Is What You Get) artinya tampilan yang kita lihat ketika menulis/memposting sama dengan tampilan yang kita lihat setelah di publish, sedangkan Edit Html sebaliknya, artinya untuk membuat suatu tampilan yang bagus kita harus meletakkan tag-tag HTML jika diinginkan. OK, kembali ke Toooooo.....PIK!!! :p
3. Setelah memilih tab menu "Edit Html", maka secara otomatis akan terlihat kode:

<span class="fullpost">

</span>



4. Nah letakkan potongan artikel yang akan kita tampilkan di halaman muka sebelum kode diatas, dan letakkan sisanya di dalam kode diatas, seperti terlihat dibawah ini:

...potongan postingan...

<span class="fullpost">

...sisa postingan...

</span>



5. Kode diatas muncul sebagai akibat ketika kita meletakkan kode di menu Formatting/Format.
6. Cukup mudah kan membuatnya? Hanya sedikit oprekan di template dan di formatting.
Catatan: Hindari menulis tag paragraf <p> , pengalaman saya tag ini bisa membuat tag span menjadi tidak berfungsi CMIWW.

Komentar :

Ada 0 komentar ke “Membuat Readmore | Baca selengkapnya di Blogspot”

Post a Comment

Keluarkan uneg-unekmu sobat!! Jangan disimpan dalam hati, dan saya ucapkan terima kasih...