Cara Buat Read More Blogger Blogspot di Editor Baru

Cara membuat Read More / Baca Selengkapnya / di Blogger Blogspot dengan Editor Baru (Updated Editor)
Saat ini Blogger Blogspot memiliki dua pilihan di dasbor posting. Ada editor lama dan ada editor baru.
Pada Editor Baru, fasilitas Read More sudah tersedia secara by-default, mirip seperti Wordpess. Tapi kalau Anda sudah memakai Read More editor lama dan malas untuk merubahnya, maka Anda tak perlu mengikuti tutorial ini.
DAFTAR ISI TUTORIAL
I. Mengganti Editor Baru
II. Pakai Template dari Blogger Blogspot
III. Cara Posting Artikel
IV. Apabila Template Bukan Buatan Blogger

I. Ganti Editor Baru (Updated Editor)

1. Login ke Blogger.com
2. Klik Blog yang akan diedit -> Setting / Pengaturan -> Basic / Dasar ->
3. Select Post Editor/ Pilih Editor Entri -> check Updated Editor / Editor yang diperbarui
4. Save Settings

II. Pakai Template dari Blogger Blogspot
Kalau tidak mau memakai template yang disediakan Blogger.com, maka harus menambah kode. Lihat kode dan tutorialnya di bawah.

1. Login ke Blogger.com (kalau sudah login, langsung ke no. 2)
2. Rancangan / Design -> Perancang Template / Template Design -> pilih template yang sesuai.
3. Klik Apply to Blog (pojok kanan atas) -> Back to Blogger.
4. Selesai.

III.  Cara Posting (Menulis Artikel)

1. Klik Posting / Entri Baru -> Beri Judul Tulisan
2. Klik Edit HTML (bukan Compose)
3. Kasih kode <!–more–> di kotak posting.
4. Taruh tulisan ringkasan sebelum <!–more–>, sedangkan tulisan lanjutannya setelah <!–more–>.
5. Klik Terbitkan Entri / Publish Entry.
6. Selesai. Anda baru saja membuat artikel dengan “Read More” gaya baru.

IV.  Apabila Template Bukan Buatan Blogger Blogspot
Apabila template yang dipakai bukan template yang disediakan Blogger.com, maka Anda harus menambah kode tertentu supaya kata “Read More”-nya muncul. Ikuti panduan berikut:

1. Pada Rancangan / Design -> Edit HTML -> conteng / kasih tanda tik pada Expand Template Widget
2. Cari kode berikut (Tip: Pakai F3 atau CTRL+F):
   <div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
3. Copy kode berikut, dan taruh persis di bawah kode no.2:
   <b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>
</div>
</b:if>
4. Klik Simpan Template / Save Template. Selesai.