Langkah 1 (MANUAL)
1. Pada saat kita akan mengetik posting dan kemudian akan
kita publikasikan, pada tampilan Header atau diatasnya terdapat berbagai alat
atau lebih akrabnya sering kita sebut "Tools" yang bisa kita
gunakan, nah cara untuk membuat tampilan posting menjadi 'read more atau baca
selanjutnya' selain dari skrip HTML kita juga bisa mengatur melalui Tools
tersebut.
Contoh bisa kita lihat pada gambar dibawah ini:
Pada gambar yang sudah saya beri tanda panah terlihat
'Tools' yang seperti kertas sobek, itulah yang akan kita gunakan untuk menandai
dimana kita akan meletakan 'Read More atau Baca Selanjutnya>>'.
2. Caranya adalah kamu tinggal arahkan kursor mouse
dimananapun kamu akan meletakan 'Read More atau Baca Selanjutnya>>' dalam
posting yang sudah kamu buat, kemudian kamu hanya tinggal menekan 'Tools'nya.
bisa kita lihat cara seperti pada gambar dibawah ini:
3. Jika sudah terdapat garis pemisah seperti pada gambar
Cara 2 di atas yang ditunjukkan pada tanda anak panah No.3 maka proses sudah selesai. kemudian
untuk melihat hasilnya kita bisa menekan 'Pratinjau' .
4. Untuk mengatur berapa posting yang akan kita tampilkan,
kita bisa mengaturnya dengan menuju
'Tata Letak -> Posting Blog -> edit'
Contoh seperti pada gambar dibawah ini:
Demikian cara mudah membuat 'Read More', semoga bermanfaat
dan terimakasih telah berkunjung di blog saya yang sederhana ini.
Langkah 2 (OTOMATIS)
Cara Membuat Read More di
Blogger dengan Mudah :
- Silahkan Login di akun blogger anda
- Lalu klik Rancangan dan klik Edit HTML
- Jangan lupa untuk mencentang Expand Template Widget
- Untuk menghindari hal2 yang tidak diinginkan maka simpan/backup terlebih dahulu template saudara, untuk menghindari hal yang tidak diinginkan.
- Kemudian Cari kode <head>. Dan untuk mempermudah pencarian kode nya anda tekan aja ( CTRL + F )
- Lalu silahkan tambahkanlah kode yang ada dibawah ini tepat diatas kode <head> tersebut.
<script
type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height
= 100; img_thumb_width = 120; </script> <script
src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js'
type='text/javascript'/>
- Bila anda ingin merubah ukuran pada Read More anda tersebut, kamu tinggal merubah bagian-bagian kode yang berwarna biru di bawah ini, dan Ubahlah angkanya sesuai dengan keinginan anda.
summary_noimg
= 430; adalah
tinggi potongan artikel tanpa gambar
summary_img = 340; adalah tinggi potongan artikel dengan gambar
img_thumb_height = 100; adalah ukuran tinggi thumbnail
img_thumb_width = 120; adalah ukuran lebar thumbnail
summary_img = 340; adalah tinggi potongan artikel dengan gambar
img_thumb_height = 100; adalah ukuran tinggi thumbnail
img_thumb_width = 120; adalah ukuran lebar thumbnail
- Langkah Selanjutnya cari kode <data:post.body/> lalu ganti tag <data:post.body/> tersebut dengan kode script di bawah ini :
<b:if cond='data:blog.pageType !=
"item"'> <div expr:id='"summary" +
data:post.id'><data:post.body/></div><script
type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script><span class='rmlink'
style='float:right;padding-top:20px;'><a expr:href='data:post.url'>»»  ReadMore...</a></span> </b:if><b:if
cond='data:blog.pageType ==
"item"'><data:post.body/></b:if>
- Perhatikan = untuk tulisan " ReadMore " bisa diganti sesuai dengan kesukaan anda!
- Selanjutnya, Simpan dan Lihat Hasilnya!
Semoga
Bermanfaat!,,
Tidak ada komentar:
Posting Komentar