Membuat menu readmore

Sebenarnya malas juga membuat tutorial cara membuat menu Read More atau Baca Selengkapnya ini karena Blogger sudah support fungsi Readmore. Tapi berhubung teman satu kerjaan Mas Viving menanyakan langsung kepada saya waktu di perusahaan terpaksa dech bikin juga tutorial ini dan sekalian di posting aja daripada mubazir. Dan karena ada embel-embel males juga akhirnya saya tulis aja langsung seperti ini dan gak pake basa-basi dulu.

LANGKAH #1
1. Login ke Blogger.
2. Klik menu Pengaturan.
3. Klik menu Format.
Pada layar paling bawah ada text area kosong di samping tulisan Template Posting. Isi text area kosong tersebut dengan code ini:

<span class="fullpost">
</span>


Maksud dari code ini agar saat posting artikel, kode tersebut sudah muncul tanpa harus menulisnya dulu berulang-ulang.

4. Klik tombol Simpan Pengaturan.

LANGKAH #2
1. Klik menu Dasboard.
2. Klik menu Tata Letak.
3. Klik menu Edit HTML.
4. Klik tulisan Download Template Lengkap. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
Centang kotak kecil di samping tulisan Expand Template Widget, lalu cari code berikut:

<data:post.body/>

atau kode ini (sama saja);

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

Hapus kode diatas dan ganti dengan kode di bawah ini:

<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/>
<a expr:href='data:post.url'><strong>Read More...</strong></a></p>
</b:if>


5. Klik tombol Simpan Template
6. Selesai.

Cara Posting Artikel
1. Klik menu Posting
2. Klik menu Edit HTML, Otomatis code yang telah kita setting tadi muncul, yaitu :

<span class="fullpost">
</span>


3. Tuliskan artikel yang ingin tampak pada halaman depan blog sebelum kode:

<span class="fullpost">

dan tulis sisanya setelah kode :

<span class="fullpost">

di atas tadi dan sebelum kode :

</span>

4. Klik tombol bertuliskan PUBLIKASIKAN POSTING.
5. Klik tulisan Lihat Blog (di jendela baru) untuk melihat hasilnya, kemudian lihat apakah hasilnya sukses atau tidak. Jika tidak, mungkin ada bagian yang terlewatkan. Coba lihat kembali langkah diatas.

Selamat Mencoba!

0 Response to "Membuat menu readmore"

Post a Comment

PERHATIAN !...
*. Baca dulu artikel dan komentar yang ada sebelum Anda menulis komentar
*. Harap berkomentar dengan bijak dan sopan
*. Jika mengajukan pertanyaan, beri centang pada kotak disamping tulisan "Beri tahu saya" untuk mendapatkan jawaban melalui email
*. Dilarang menyertakan "LINK HIDUP", "IKLAN" "SPAM" dalam komentar karena akan dihapus atau dimasukkan ke dalam Comment Spam