Readmore Tricks!

Postingan ini hanya sebagai penjelasan dari help-nya blogger dan bukan tutorial loh jreng!! trick ini fungsinya menyembunyikan sebagian dari postingan di halaman depan blog-nya saja. Caranya mudah sekali, hanya untuk postingan-postingan sebelumnya untuk dapat menggunakan trick ini harus diedit pada postingannya. (bingung ?!)

Maksudnya, trick menyembunyikan sebagian postingan ini hanya berlaku pada postingan yang sekarang dan yang akan datang, dah untuk postingan yg sebelumnya harus diedit satu persatu. Judul aseli dari trick ini yang "dicolong" dari help-nya blogger adalah

"How can I create expandable post summaries?"
dari alamat
http://help.blogger.com/bin/answer.py?answer=898&topic=41

udah dech, mendingan langsung aja engga usah ba-bi-bu lagi. ini postingan yang ke-2 untuk hari ini. Bukan maksud untuk maruk cuman saya lihat di blog temen-temen khususnya yang menggunakan Blogger tidak menggunakan trick ini. Apa itu udah tahu cuman engga tertarik atau belum tahu sama sekali atau bahkan udah tahu cuman engga tahu cara pasangin ke template-nya. Keuntungan memakai trick ini, kita bisa memasang beberapa postingan (banyak!) dengan hanya menampilkan intro dan judul postingannya saja, dan untuk membaca lebih lanjut ditempatkan link readmore untuk melihat full postingannya. Ya seperti yang saya pakai sekarang ini. *smile!*

Caranya :
Login dulu ke Blogger-nya trus, buka setting -> template, biasakan backup dulu templatenya kalo-kalo nantinya engga suka, gagal atau bahkan kahapus! simpan ke dalam notepad. cari bagian dari :

< style type = "text/css" > <!--
................ kode-kode css
kode-kode css................
--> </ style >

itu kalo css-nya disimpan pada html-nya/ tidak dalam bentuk css file. Untuk yang menggunakan css file yang ditaro di tempat lain sama aja caranya. paste-kan code dibawah ini diantara tag < style type = "text/css" > </style > , saya sarankan untuk ditempatkan dibagian paling bawah di antara tag < style type = "text/css" > </style > seperti ini :

< style type = "text/css" > <!--
................ kode-kode css
<MainOrArchivePage>
      span.fullpost {display:none;}
</MainOrArchivePage>
<ItemPage>
      span.fullpost {display:inline;}
</ItemPage>
--> </ style >


Sesudah itu tahap selanjutnya, cari code seperti ini <$BlogItemBody> . Kode ini adalah kode isi dari postingan-postingan kita nantinya, tambahkan dengan kode di bawah ini :

<MainOrArchivePage>
<br /> <a href="<$BlogItemPermalinkURL$>">Read more!</a>
</MainOrArchivePage>

Secara default untuk link read more-nya adalah seperti di atas, bisa kita costumize lagi ke depan sesuai dengan kebutuhan. Dan untuk text read more bisa saja diganti dengan yang lain sesuai dengan selera. (gaya seperti Rudi pas acara masak!) Jadi komplitnya seperti ini.

<$BlogItemBody>
<MainOrArchivePage>
<br /> <a href="<$BlogItemPermalinkURL$>">Read more!</a>
</MainOrArchivePage>

Nah untuk template sudah kelar, kemudian cara menggunakannya adalah :
ketika postingan sudah ditulis dengan rapi dan lengkap tentukan bagian mana yang hanya akan muncul pada bagian depannya saja. misalkan untuk alinea pertama muncul di depan dan sisanya akan muncul ketika link readmore diklik!

ALINEA 1
<span class="fullpost">
ALINEA 2
ALINEA 3
ALIEA 4
</span>

Alinea 2 s/d 4 yang berada pada di antara tag <span class="fullpost"> tidak akan dimuncul di halaman depan, dan hanya akan muncul jika link readmore diklik. Penggunaan tag <span class="fullpost"> ..... </span> terus dilakukan pada tiap postingan selanjutnya secara manual.

Masih ada trick-trick lainnya yang bisa digunakan sehubungan dengan tag-tag dari Blogger. Siapa tahu tertarik? Bisa dilihat lebih lanjut ke Blogger Hack . Karena kalo diposting disini kesannya engga kreatif. :P Dan lebih lanjut bisa dikembangkan dan dimodifikasi sesuai dengan kebutuhan.

Back