Cara Membuat Read More

Sering kita melihat tulisan readmore atau baca selengkapnya di bawah penggalan postingan. Dan jika tulisan itu kita klik akan menampilkan post secara utuh.Jadi kegunaan readmore adalah untuk memenggal kalimat yang ditampilkan pada halaman utama sebuah situs. Letak Readmore ini ditempatkan di sebuah artikel.
Fungsi dari pemasangan Readmore :

Membuat loading lebih ringan.

Menghemat ruang pada tampilan halaman utama sebuah website.

Menjadi Lebih Elegant dan Interaktif.

Membuat pengunjung membaca artikel tersebut hingga selesai.

Menambah pageviews artikel yang dibaca oleh pengunjung.

Menambah Link Anchor terhadap keyword judul.

Ada 2 cara untuk membuat fungsi readmore atau baca selengkapnyasecara otomatis dan secara manual.

CARA MEMBUAT AUTO READ MORE DENGAN THUMBNAIL DI BLOGGER DENGAN JAVASCRIPT

Pertama yang harus dilakukan adalah klik Rancangan -> Edit HTML -> tanda tik/centang Expand Widget Template. Setelah itu ikuti panduan di bawah.

1. Cari kode </head>
2. Letakkan kode berikut di atasnya kode no. 1
   
   

   <script type= 'text/javascript' > var thumbnail_mode = " float " ; summary_noimg = 230; summary_img = 140; img_thumb_height = 100; img_thumb_width = 100; </script><br /> <script src= 'http://keerthiset2.110mb.com/excerpt.js' type= 'text/javascript' />

   Catatan: angka-angka di atas dapat dirubah sesuai selera.
3. Cari kode berikut: <data:post.body/>
4. Ganti kode tersebut dengan kode di bawah

<b: if cond= 'data:blog.pageType== "item"' > <data:post.body/> <b: else /> <div expr:id= '"summary" + data:post.id' > <data:post.body/> </div><script type= 'text/javascript' > createSummaryAndThumb("summary<data:post.id/>"); </script><br /> <div style= 'clear: both;' /><span style= 'padding-top:5px;;float:right;text-align:right;' ><a expr:href= 'data:post.url' rel= 'bookmark' ><b>Reade more >></b></a></span></div></b: if >

5. Klik Simpan Template.

Selesai.

CARA MEMBUAT AUTO READ MORE DENGAN THUMBNAIL DI BLOGGER TANPA JAVASCRIPT

Memakai auto read-more yang dilengkapi dengan thumbnail (gambar kecil) di halaman muka atau homepage blogger tanpa javascript membuat loading blog/website akan lebih ringan. Caranya sebagai berikut:

1. Masuk/login ke blogger.com
2. Klik Template -> Lanjutkan -> Edit HTML
3. Beri tanda tik/centang pada Expand Widget Template
4. Cari kode </b:skin>
5. Taruh kode berikut sebelum atau di atasnya kode nomor 4:

thumb img { float : left; margin: 0 10px 10px 0; }

6. Cari kode berikut: <data:post.body />
7. Hapus kode nomor 6 dan ganti dengan kode di bawah:

<b: if cond= "data:blog.pageType != "item"" > <b: if cond= "data:post.snippet" > <b: if cond= "data:post.thumbnailUrl" > <div class = "Image thumb" ><img expr:src= "data:post.thumbnailUrl" > </div></b: if > <data:post.snippet> <b: if cond= "data:post.jumpLink!= data:post.hasJumpLink" > <div class = "jump-link" ><a expr:href= "data:post.url +"#more"" expr:title= "data:post.title" ><data:post.jumptext></data:post.jumptext></a></div></b: if > <b: else > <data:post.body> </data:post.body></b: else ></data:post.snippet></b: if > <b: else > <data:post.body> </data:post.body></b: else ></b: if >

CARA MEMBUAT READ MORE MANUAL DI BLOGGER

Ada dua cara. Cara pertama, waktu menulis artikel klik Edit HTML di kanan atas. Tambahkan kode <!--more--> . Artikel yang akan disembunyikan taruh di bawah kode, sedang artikel yang akan ditampakkan di halaman utama letakkan di atas kode. Cara Kedua Kotak posting dalam keadaan"Compose". kemudian klik menu Jumpbreak yang berada di samping menu Video. Kalau Anda sudah mengikuti kedua cara tersebut, tapi "read more"-nya tidak muncul, maka lakukan setting/setelan "Pilih Editor Entri yang Dimutakhirkan." Caranya, ikuti tip berikut:

1. Caranya, masuk ke Blogger.com-> Pengaturan -> Dasar -> Setting Global (paling bawah) ->
2. Centang / kasih tanda tik pada"Editor yang dimutakhirkan."
3. Jangan lupa klik Simpan Setelan.

Kelebihan cara manual adalah lebih fleksibel. Artinya, untuk artikel pendek yang cuma satu atau dua paragraf tidak perlu memakai Read More