Cara Membuat Read More Menggunakan Span-id

Karena kesal karena tidak menemukan trik untuk membuat read more menggunakan syntax <span id="fullpost"> akhirnya saya beranikan untuk bereksperimen lagi. Sudah lama tidak melakukan eksperimen lagi buat saya agak bingung. Tapi untungnya saya bisa menyelesaikannya dengan baik. Ehm, saya menemukan trik ini sendiri lho. Tapi kalo trik ini emang udah ada dan persis menggunakan kode seperti saya, berarti itu kebetulan, hehe. Trik ini mengungkap bagaimana kita membuat read-more. Pasti Anda sudah tahu apa itu read-more. Read-More sama saja dengan penyingkatan posting pada halaman utama blog agar tidak terlalu panjang. Dengan meng-klik link Read More, maka kita akan langsung menuju link postingan tersebut.

Udah gitu aja deh intermezo nya, wakakakak :))
Saatnya membeberkan eksperimen saya. Ikuti langkah-langkah berikut ini:

1. Pertama-tama, mari kita menuju Blogger.com untuk Login
2. Kalau sudah Login, kita Langsung ke Setting/Pengaturan
3. Pada tab menu pilih Formatting
4. Pada tampilan bawah ada kotak kosong. Nah, kita isi dengan kode berikut:

   <span id="fullpost">
   
   
   </span>

5. Kemudian klik tombol Save Setting/Simpan Pengaturan

Pemasangan kode ini bertujuan untuk mempermudah kita menampilkan kode tersebut pada Edit HTML sewaktu kita hendak memposting suatu artikel. Jadi kode tersebut akan otomatis muncul dan kita tinggal menulis posting tanpa kesulitan mengingat kode tersebut jika kita belum memasangnya.

Langkah selanjutnya adalah pengeditan pada HTML. Mari ikuti langkah-langkah berikut ini:

1. Pada Dashboard pilih Layout/Tata Letak
2. Klik Edit HTML pada tab menu yang tampil
3. Kalau sudah, klik kotak Expand Template Widget
4. Cari kode di bawah ini:
   

   <div class='post-body'>

   Kalo nggak ketemu coba cari kode ini:
   

   <div class='post-body' expr:id='&quot;post-&quot; + data:post.id'>

5. Kemudian letakkan kode berikut ini di bawah kode tadi:
   

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

6. Nah, terus di bawahnya kan ada kode

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

   Taruh kode ini di bawah kode tadi:
   

   <span id='showlink'>
   <a expr:href='data:post.url'>Read more...</a>
   </span>
   <script type='text/javascript'>
   checkFull(&quot;post-&quot; + &quot;<data:post.id/>&quot;);
   </script>
   </b:if>

7. Tulisan Read more... bisa Anda ganti sesuai keinginan, misalnya Baca Selengkapnya, dll.
8. Tinggal Save Settings/Simpan Perubahan

Nah, cara mengeposkan artikelnya adalah seperti metode berikut ini:
Postingan yang akan tampil pada halaman utama<span id="fullpost">Posting yang akan disembunyikan dari halaman utama</span>

Ohya, kode <span id="fullpost"> akan muncul hanya pada saat kita akan menulis posting pada tab Edit HTML. Kalau pada tab Compose, kode ini tidak akan muncul. Jadi pindah dulu ke Edit HTML kalau masih pada posisi Compose.

Udah jelas kan? Kalau ada yang kurang jelas, tanyain pada kolom komentar aja ya? Semoga berhasil!!!

Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di die-silver.blogspot.com

Gunakan Tombol berikut untuk menyimpan halaman :
Cara Membuat Read More Menggunakan Span-id
menjadi format PDF dan lebih maksimal jika terdapat kesalahan koneksi atau yang lainnya.

..::Artikel Menarik Lainnya::..

Trik Blog

• Masalah Pada Kotak Komentar
• Memberi Penomoran Pada Daftar yang Ditulis
• Editor Baru untuk Posting di Blogspot
• Mengganti Tulisan Read More dengan Gambar
• Cara Mengembalikan Blog yang Terhapus
• Cara Setting Domain Berbayar di Blogspot Tanpa Hosting
• Cara Membuat Status YM Sendiri
• Cara Memasang Emoticon di Atas Kotak Komentar
• Hosting Gratis 000webhost.com Mengalami Problem
• Cara Membuat Spoiler di Blog
• Cara Memasang Gadget Online Visitor
• Cara Berkomentar yang Baik dan Benar
• Membuat Menu Dropdown Dan Variasinya
• Pasang Alert di Blog Sebagai Pesan Penutup
• Cara Memodifikasi Tulisan PAda Blog
• Cara Membuat Daftar Isi Pada Blog
• Cara Membuat Tabel Pada Blog
• Mempercantik Tampilan Judul Posting pada Label
• Membuat Huruf Posting Bergaya Koran
• Cara Pasang Statistik dan Tracker
• Cara Menampilkan Recent Comments
• Cara menghilangkan Tang dan Obeng
• Memodifikasi Tampilan Artikel Berlangganan Feedburner
• Memasang Widget Artikel Terkait/Related Post pada Blog