Cara Membuat Read More di Blogger Baru

11:29:00 AM konixbam

Setelah lama berjuang dan menghalalkan segala cara, surfing ke blog-blog ternama nyari tutorialnya, yang ujung - ujungnya ketemu error melulu, blogger-emoticon.blogspot.com akhirnya bisa juga buat read more... di blog ini. blogger-emoticon.blogspot.com
Nah, karena itu akan coba sharing caranya.
Tutorial ini dibuat oleh A. Fatih Syuhud. blogger-emoticon.blogspot.com
Ada dua cara untuk membuat read more di blogger / blogspot baru (tanda Blogger Baru adalah di admin memakai layout / tata letak dan page element / elemen halaman).

Cara Pertama

1. Buka template (klik "Kustomisasi")-> "Tata Letak" -> "Edit HTML" -> Kasih tanda tik/centang pada menu "expand widget tempate"
Gambar 1:
centang


2. Letakkan kode berikut persis di atasnya kode </head>


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


Gambar 2:
template_2

3. Letakkan kode berikut di bawah kode


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


kode berikut:


<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>


Gambar 3:
template_3

4. Klik "SIMPAN TEMPLATE". Selesai.

5. Klik tab "Setting" atau "Pengaturan", terus klik "Formatting" atau "Format". Di paling bawah ada kotak kosong di samping menu "Template Posting". Isi kotak kosong tersebut dengan kode berikut:


"postingan yang muncul di halaman depan"
<span class="fullpost">
"lanjutan postingan"
</span>


Jangan lupa klik "SIMPAN PENGATURAN".

6. *Cara Memposting
Ketika memposting, klik Edit HTML (bukan Compose atau Tulis). Maka, secara otomatis akan tampak kode


"postingan yang muncul di halaman depan"
<span class="fullpost">
"lanjutan postingan"
</span>


Letakkan posting yg akan ditampilkan di halaman muka di atas kode sementara sisanya (yakni keseluruhan entry/artikel), letakkan di antara kode


<span class="fullpost">
dan("lanjutan postingan")
</span>


Apabila Anda berhasil melakukan cara bikin Read More... di atas tak perlu lagi mencoba cara di bawah. Cara di bawah cuma sebagai alternatif dan agak lebih rumit di banding cara yang di atas.

Cara Kedua

1. Buka template –> edit HTML
2. Kasih tanda tik/cek menu “expand widget template”
3. Cari kode berikut di Template blog Anda:


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


4. Kalau sudah ketemu, letakkan kode berikut di bawah kode html 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>


5. Di Bawah kode di atas ada kode html sebagai berikut:


<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>


6. Nah, di antara kode


<p><data:post.body/></p>
dan
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>


pasang kode html ini:


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


7. Jadi, susunan kode html di template setelah ditambah dengan kode READ MORE... akan menjadi seperti ini:


<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'>Read More......</a>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>


Klik "SIMPAN TEMPLATE". Selesai. blogger-emoticon.blogspot.com

* Cara Mempostingnya sama dengan cara memposting yang diatas.


Masalah Yang Sering Dihadapi
blogger-emoticon.blogspot.com
1. Saat mengklik "Simpan Perubahan" kita sering mendapat pesan demikian:

XML error message: The element type “style” must be terminated by the matching end-tag “”.

Jangan panik. Itu artinya tanda petik / kutip buka tutup (quote/unquote) yakni tanda ' dalam kode tidak cocok dengan font template. Yang perlu dilakukan adalah buang tanda kutip ['] itu dan kasih tanda kutip yang baru di tempat yang sama. Dan coba klik lagi SIMPAN.

2. Kalau menemukan pesan error bx-xxxx atau apalah, coba bersihin cache internet atau coba edit blog Anda dengan mengganti dengan menggunakan browser yang lainnya.

3. Anda sudah berhasil memasang seluruh kode di atas, tetapi ‘read more’ gak berhasil; posting tetap panjang? Dan tulisan ‘read more’ nongol di bagian bawah artikel? Tenang. Ikuti solusi berikut: klik “Pengaturan” -> klik “Format” -> buang/delete semua tanda kutip buka/tutup (quote/unquote) di “fullpost” dan ganti dengan tanda kutip yang baru. Jangan lupa klik “Simpan”.
Selesai. Selamat ngeblog di blogger / blogspot dengan Read More...

Sumber: http://afatih.wordpress.com/2007/10/26/cara-buat-read-more-di-blogger-baru/
blogger-emoticon.blogspot.com

ARTIKEL TERKAIT LAINNYA:



4 KOMENTAR:

zhind mengatakan...

info yang bermanfaat buat blogger2 baru maupun yang dedengkot...
dolo saya jg pernah binggung buat read more ampe harus berkali2 ganti template krna error melulu....

konix_bam mengatakan...

siip... ternyata permasalahannya cman karena firefoxnya rada error... klo muncul error trus.. coba bersihin cache nya klo masih belum mau juga, ganti browser nya ama yang lain aja...

chodri mengatakan...

MKSH DAH NGASIH KOMENTAR DAH BISA MEMBANTU SAYA

Cara Instalasi Windows XP mengatakan...

makasih bnyak bro ud share,lumayan nambah wawasan saya :)

Posting Komentar

Iklan