Membuat "Read More" atau "Baca Selengkapnya" pada Blogger

"Read More" atau "Baca Selengkapnya" adalah pemenggalan kalimat pada posting suatu halaman, Pemenggalan halaman posting biasanya ditandai dengan "Read More", "Next", "Baca Selanjutnya", "Baca berikutnya", "Selengkapnya" atau lain sebagainya. Readmore biasanya digunakan untuk menandai bahwa kalimat pada posting masih mempunyai kelanjutan, dan juga berguna mempersingkat halaman posting yang panjang.

Untuk membuat readmore ikuti langkah dibawah ini :

1. Buka Template - Edit HTML - Berikan tanda centang pada "Expand widget template".

2. Jangan lupa backup template blogger anda terlebih dahulu dengan mengklik "dowlnoad template lengkap".

3. Cari kode dibawah ini:

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

Tips : Untuk mempermudah pencarian kode diatas sebaiknya ikuti tips berikut ini. Pertama kamu buka program text editor misalnya notepad.exe (Pada MS Windows tekan menu Start -> Proggram -> Accessories -> Notepad) kemudian copy/paste kode HTML tadi ke notepad. kemudian pada notepad pilih Menu Edit -> Find. pada box find masukan kode ini <div class='post-header-line-1'/> kemudian klik tombol Find next. (jika masih gak ketemu terpaksa kita melakukan pencarian secara manual).

4. Jika sudah menemukan kode diatas, Copy-Paste kode dibawah ini kemudian letakan kode tersebut dibawah kode diatas.

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

5. Kemudian dibawah kode diatas kita akan menemukan kode:

<p><data:post.body/></p>

Lakukan Copy-Paste kode dibawah ini dibawah code diatas

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

Tips: Kode "Read More" diatas bisa ganti dengan kalimat sendiri (contoh "Baca Selanjutnya", "Baca Berikutnya", "Selengkapnya" atau lain sebagainya.)

Kode selengkapnya jika dilihat akan tampak sebagai berikut:

<div class='post-header-line-1'/>
<div class='post-body'>
<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'>Readmore »»</a>
</b:if>
<div style='clear: both;'/>

6. Simpan

7. Setelah kode diatas disimpan kita kembali dan masuk ke tab Pengaturan -> Format -> cari "Post Template" Kemudian pada kotak masukan kode dibawah ini:

<div class="fullpost">
</div>

8. Simpan

Cara penggunaan readmore pada halaman posting. Ketika kita melakukan posting pertama kali kita akan melihat kode:

<div class="fullpost">
</div>

Ingat jangan hapus kode diatas karena kode tersebut merupakan kode yang akan kita gunakan dalam pemenggalan posting nantinya.


Other link :

Share on...