Tahap VI - Membuat Read More....

Tahap VII- Membuat Read More....

Banyak yang nanya bagaimana memotong postingan di blogspot dengan kata “baca selengkapnya..” atau “read more..” sehingga yang tampil di halaman depan hanya separuh postingan dan postingan lengkap akan muncul apabila link “baca selengkapnya..” atau “read more..” di klik.

mas, mau nanya boleh? saya dah lama penasaran sama yg namanya kode untuk mempersingkat postingan….yang biasanya berbunyi : “read more” atau “cerita selengkapnya..”. soalnya kalo ga digituin puanjaaaang…suka pusying. makasih loh. ditunggu jawabannya.

Sebenarnya fasilitas ini nggak ada di blogger/blogspot, tapi kalo kamu pake wordpress fasilitas ini udah ada, cukup klik dimana kamu pengen memotong postingan, kemudian klik icon SPLIT POST USING READ MORE TAG.

Tutorial secara manual....

1. Kita buka blog kita yang ada di blogger

2. Klik posts

3. Klik edit posts

4. Buat posts baru dan isi dengan 1/2 berita yang akan kita tampilkan

5. Dibagian paling bawah berita tadi ketik Read More......

6. Dan buka bagian menu edit html yang telah tersedia di tempat posting tersebut

7. Setelah itu ......cari tulisan Read More...... sebelum Read More kita ketik...... Read More.......

8. http://baek.blogspot.com/2007/04/hidup_9371.html ( alamat dimana berita tersebut ditampilkan )
   untuk mengetahuinya kita harus buka edit posts dan sorot berita yang kita tampilkan..... * klik kanan pada bagian view (berita yang di tampilkan tadi
   <"baek.blogspot.com/2007/04/hidup_9371.html"> Read More.......

9. Setelah itu kita Compose - PUBLISH POST

10. Untuk memastikan Read More berfungsi kita atur ulang setting - formatting - kita ganti shownya kita ganti 1 posts kita save

11. Coba liat tampilan blog anda yang terbaru di View

Tutorial Menggunakan Css....

Untuk pengguna blogspot, berikut ini langkah modifikasi yang bisa dilakukan. Trik ini menggunakan css untuk menyembunyikan sebagian post, sehingga hanya bagian yang diinginkan saja yang tampil di halaman depan.

Pertama buka template blogger kamu, kemudian tambahkan CSS berikut, CSS biasanya terletak di antara tag


span.Read More {display:none;}






span.Read More {display:inline;}




Dengan style ini, kita membuat sebuah class di css dengan nama “Read More” dan hanya akan tampil ketika postingan berdiri sendiri (post page). Sebagian dari berita akan menggunakan class ini seperti yang akan saya jelaskan kemudian.

Langkah kedua adalah menambahkan kode untuk menampilkan link “baca selengkapnya…” tambahkan kode berikut setelah kode < $BlogItemBody$> pada template kamu:


Read More




Kamu bisa mengganti tulisan “Read More..” dengan kata lain yang kamu suka!

Setelah mengkopi kode-kode diatas kedalam template kamu, Save Template dan Republish.

Langkah terakhir adalah melakukan modifikasi setiap kali kamu membuat postingan. Ketika membuat berita yang akan dipotong, selalu gunakan mode Edit Html bukan Compose mode , dan tambahkan kode seperti contoh berikut ini:

Ini adalah awal postingan dan akan dipotong disini. Ini adalah akhir postingan saya

maka akan menghasilkan sebuah postingan seperti ini:

Ini adalah awal postingan dan akan dipotong disini Read More.....

ketika link di klik maka akan menampilkan postingan secara penuh seperti ini:

Ini adalah awal postingan dan akan dipotong disini. Ini adalah akhir postingan saya.

Selamat mencoba !