Cara membuat read more di blogger ( 1 )

Sebelum membahas bagaimana cara membuat read more di blogspot, terlebih dahulu saya akan sedikit berbicara tentang read more itu sendiri. Apa itu Readmore? 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 Pertama

1. Login di Blogger, kemudian masuk ke halaman edit html
 
2. Cari kode html seperti ini :
<div class='post-header-line-1'/>
<div class='post-body entry-content'>



3. Kemudian simpan kode berikut di bawah kode yang tadi:

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



4. Selanjutnya, dibawah kode yang baru anda simpan barusan, terdapat kode seperti ini :
   
   <data:post.body/>
   <div style="'clear:"> <!- clear for photos floats ->
   </div>
   
   lalu diantara kode
   
   <data:post.body/>
   
   dan
   
   <div style="'clear:"> <!- clear for photos floats ->
   </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-header-line-1'/>
   <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>
   
   <data:post.body/>
   <a expr:href='data:post.url'>Read More .. </a>
   </b:if>
   <div style="'clear:"> <!- clear for photos floats ->
   </div>

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

Ilustrasinya: 

"ini adalah text yang akan ditampilkan"

<span class="fullpost">

"ini adalah text lanjutannya"

</span>

Sekian. Terima kasih :)