Cara Buat Read More di blogger

Sebelum membahas bagaimana cara membuat readmore di blogspot, terlebih dahulu saya akan sedikit berbicara tentang read more itu sendiri. Read more adalah suatu fungsi yang dapat meringkas suatu artikel / postingan pada blog. Intinya dengan menggunakan cara read more ini, suatu postingan tidak akan tampil seutuhnya pada halaman utama blog (Home). Melainkan hanya berupa ringkasan saja. Setelah kata / tulisan read more itu di klik, barulah seluruh postingan akan tampil.
Cara Membuat Read More Tahap Kesatu

1. Login di Blogger, kemudian masuk ke halaman edit html
2. Kasih tanda checklist pada kolom expand template widget
3. Cari kode html seperti ini :

   <div class='post-header-line-1'/> <div class='post-body entry-content'>

4. Kemudian simpan kode berikut di bawah kode yang anda cari barusan:

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

5. Selanjutnya, dibawah kode yang baru anda simpan barusan, terdapat kode seperti ini :

   <data:post.body/>
   <div style="clear: both;"></div>
   <!-- clear for photos floats -->

   lalu diantara kode
   

   <data:post.body/>

   dan
   

   <div style="clear: both;"></div>

   Simpan kode yang ini :
   

   <a expr:href='data:post.url'>Read More .. </a> </b:if>

   Sehingga hasil dari perubahan kode html selengkapnya menjadi seperti ini :
   

   <div class='post-body entry-content'> 
   <b:if cond='data:blog.pageType == "item"'> 
       <style>.fullpost{display:inline;}</style> 
       <p><data:post.body/></p> 
   <b:else/> 
       <style>.fullpost{display:none;}</style> 
       <p><data:post.body/></p> 
       <a expr:href='data:post.url'>Read More .. </a> 
   </b:if> 
   <div style="clear: both;"></div>
   <!-- clear for photos floats -->

Cara Membuat Readmore Tahap kedua
Setelah selesai melakukan edit kode html-nya, sekarang kita beranjak ke bagaimana cara melakukan posting artikel supaya fungsi read more tersebut bisa kita aplikasikan. Berikut petunjuknya :

1. Silahkan buat postingan sampai selesai (jg dulu di publish)
2. Tentukan bagian postingan yang akan di tampilkan (ringkasan), kemudian masukan kode berikut pada akhir bagian postingan tersebut :

   <span class="fullpost">

3. Pada akhir postingan, masukan kode ini :

   </span>

4. Selesai Jika temen2 masih bingung, berikut ilustrasi dari cara posting artikel dengan menggunakan read more :

ini adalah text ringkasan <span class="fullpost"> ini adalah text lanjutannya </span>

Related Posts by Categories

Widget by Scrapur