Cara Membuat tombol READ MORE

  

Jika sebelumnya saya membahas bagaimana cara membuat read more secara manual maka kali ini saya akan membahas cara membuat Tombol Read More yang mana kata "Read More >>" atau "Baca selengkapnya >>" diganti dengan gambar tombol seperti contoh diatas. Langsung aja ya tanpa basa basi lagi.

1. Masuk/Login ke akun blogger lalu Klik menu Rancangan
2. Klik  Edit HTML
3. Klik kotak yang terdapat di depan pilihan ‘Expand Template Widget’ sehingga muncul tanda checklist.
4. Tekan tombol keyboard Ctrl + F untuk mencari kode HTML <data:post.jumpText/>
5. Ganti kode <data:post.jumpText/> dengan kode di bawah ini:

   <img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv6sxfi5ayeFD7qRwLabEzsjE_Y-pCHN3JYLXyMNqOo8z6P-_Xq3JtsGgryiXOfEGPhtVgHH8Tt_6jEZO2ipZdBy-PHgH2DR53bT9ZIneZj4flnpKsSxuhsfvc6qm_YRhetCrNV8rB6GlE/s1600/tombol-read-more_p1.GIF'/>

   
   Sehingga akan mengubah kalimat ‘Read more »’ atau ‘Baca selengkapnya »’ dengan gambar tombol read more seperti pada gambar di bawah ini.
   

   
6.  Simpan template.

Secara default gambar tombol read more akan ditampilkan pada bagian kiri halaman posting (rata kiri). Sehingga bila ingin menempatkan gambar tombol read more tersebut pada bagian kanan halaman posting, maka cari kode
<b:if cond='data:post.hasJumpLink'>
kemudian masukkan kode

<div style='text-align: right;'>

tepat di bawahnya sehingga posisi tombol akan berubah menjadi sebelah kanan.
Selamat mencoba..