Pasang Iklan di Sini

eCaraCara.Blogspot.com | sebuah jejak peradaban

-->

Jumat, 30 Januari 2009

Cara Membuat Read More

Tips blogger untuk cara membuat read more

Kalo kamu blogger pemula dan sering merasa aneh karena setiap kamu selesai memposting artikel, tampilan blog nampak memanjang ke bawah n discroll ngga habis-habis, maka ikuti tips dan trik bagaimana caranya memotong artikel dan menambahkan read more..

Pertama-tama, kamu login dulu ke blogger.com dengan e-mail address dan password kamu. Kalo sudah, pilih menu Tata Letak (Edit Layout), trus pilih sub-menu Edit HTML. Kalo sudah masuk ke mode HTML, centang bagian Expand Template Widget.

cara membuat read more pada blogger
Klik Gambarnya untuk melihat perbesaran


Nah, sekarang saatnya mencari bagian yang akan di-tweak atau di edit atau ditambahi. Cara mudah untuk mencarinya adalah dengan trik berikut:

Tekan pada keyboard kamu : CTRL + F

Kemudian masukan kode berikut : <data:post.body/> pada kotak pencarian. Contohnya seperti ini:

edit tag bikin read more
Contoh jika kamu pake browser FireFox


Nah, ketemu kan?
Sekarang, persis di bawah kode <data:post.body/> (yang diblock dengan warna hijau), tambahkan kode berikut ini:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' class='readmore'> Read More..</a>



Pastikan hasilnya seperti di bawah ini:

menambahkan kode untuk membuat read more

Oke...
Jika sudah maka jangan "Save" dulu, kamu perlu menambahkan lagi kode berupa style css (cascading style sheet). Lakukan pencarian seperti mencari kode <data:post.body/> tadi, dengan mengetikan tag ini: </head>.

Jika sudah ketemu, tambahkan persis di atas tag </head> kode di bawah ini:

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>


Kalau sudah, kini klik SIMPAN TEMPLATE atau SAVE. Jika editing kamu tidak ada yang salah, mestinya kamu tidak akan menemukan pesan error. Jika menumukan pesan error, maka klik menu BERSIHKAN EDIT dan ulangi langkah editing dari awal.

Jika sudah yakin bisa di-save dengan baik, sekarang saatnya mengatur bagian yang lain. Klik menu / tab Pengaturan dan sub-menu Format. Scroll ke bawah hingga menemukan kotak teks (textbox) berjudul Template Posting. Copy dan Paste kode di bawah ini pada text box tersebut kemudian klik SAVE.

Kode yang harus dipaste:

<div class="fullpost">



</div>


Hasilnya seharusnya seperti gambar di bawah ini:



Jangan lupa untuk meng-klik SIMPAN SETELAN.

Test Posting dengan Read More

Sekarang coba positingkan artikel untuk menguji apakah ini bekerja. Cara mempostingnya mudah. Letakkan kalimat atau paragraf pertaman sebelum tag <div class="fullpost">, dan sisanya letakkan setelahnya. Untuk lebih jelasnya seperti ini:

Paragraf atau artikel yang akan dipenggal..
<div class="fullpost">

Paragraf-paragraf lainnya yang akan disembunyikan dan tampil jika link Read More.. diklik

</div>


Sekarang publish artikel kamu dengan mode Read More, sehingga nantinya akan tampak seperti Headline Koran. Blog kamu tidak akan terlalu panjang lagi karena sebagian artikel disembunyikan pada homepage dan baru akan ditampilkan bisa tulisan Read More-nya diklik, yah... persis kayak punya saya ini.

Oh ya, Kamu bisa ganti tulisan Read More dengan tulisan lain loh.

Okeh...?
Kalo masih bingung, silahkan tinggalkan komentar. Siapa tahu saya atau pembaca yang lain bisa membantu.

Selamat mencoba membuat Read More!







Tidak ada komentar:

Posting Komentar

 

Sign up for PayPal and start accepting credit card payments instantly.