. My note: Membuat readmore...

Membuat readmore...

Saturday, January 23, 2010 | 0 Comments

http://www.emoticonizer.comBagi temen-temen yang pertama kali membuat blog atau membuat postingan di blog baru, mungkin istilah Readmore adalah sesuatu yang asing di telinga,http://www.emoticonizer.com disini saya akan mencoba menjelaskan sedikit apa itu Readmore dan manfat Readmore tersebut pada sebuah postingan.Readmore digunakan untuk mempersingkat/memenggal postingan/kalimat yang kadang-kadang terlalu panjang untuk dapat di tampilkan seluruhnya pada halaman.tentunya dengan menggunakan kode/script Readmore,blog kita akan terlihat lebih rapih dan bagus. Nah udah ngerti kan apa arti dan fungsi dari Readmore tersebut.Ok daripada kelamaan ngobrol mendingan kita langsung aja ke tutorialnya,disimak ya.

Untuk membuat readmore ikuti langkah-langkah dibawah ini :
Langkah Pertama:
Login duluke bloger kamu,buka "Template" => "Edit HTML" => berikan tanda centang pada "Expand widget template" Lihat gambar di bawah :


Langkah Kedua:
Untuk mengembalikan keadaan Template kita ke keadaan semula,apabila sewaktu-wakctu terjadi kegagalan lebih baik "Back-up" dulu template kita terlebih dahulu,"Back-up" dilakukan setelah kita memberikan tanda centang pada "Expand widget template"
Langkah ketiga:
Kamu cari kode seperti terlihat dibawah ini:


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

Untuk mempermudah dalam pencarian kode sebaiknya pergunakan fasilitas "Find".caranya hanya menekan tombol " Ctrl+F",lalu masukan kode tersebut pada kotak pencarian.Jika dengan menggunkan fasilitas "Find" tidak ketemu terpakasa kita melakukan pencarian kode secara manual.
Jika kode di atas telah berhasil ditemukan "Copy+Paste" kode dibawah ini, kemudian letakan dibawah kode di atas:

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

Kemudian cari lagi kode yang ada dibawahini:

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

Letakan kode dibawah ini,dibawah kode diatas:

<a expr:href='data:post.url'>Readmore..</a>
</b:if>

Kode lengkapnya akan terlihat seperti 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;'/>

Setelah semuanya selesai dan perubhan kode telah di lakukan selanjutnya jangan lupa klik "Save file"/"Simpan file"
Langkah keempat:
Setelah kode diatas sudah kita save selanjutnya kita masuk ke tab "pengaturan" => "Format" => "Post template" kemuadian pada kotak kita masukan kode berikut:

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

Lihat gambar di bawah ini:


Kemudian jangan lupa simpan pengaturan
Langkah kelima:
Untuk mencoba berhasil atau tidaknya,kita coba buat posting baru.Caranya klik tab "posting" => "Entri Baru".Nah disana sudah tampil dua buah kode HTML yaitu:
<div class="fullpost"> dan
</div>
Agar postingan terpotong, taruh postingan yang akan di potong "sebelum kode" <div class="fullpost"> dan sisa postingannya "sesudah" kode <div class="fullpost">.Kode </div> diletakan di paling akhir postingan.Untuk contohnya kamu bisa lihat pada gambar di bawah ini:

Sekian postingan dari saya semoga dapat menjadi media pembelajaran
selamat mencobahttp://www.emoticonizer.com happy blogging

0 komentar:

Post a Comment

Komentar anda adalah hadiah terindah buat penulis

About