Membuat Readmore di Blogger

Membuat readmore atau menyingkat tulisan di blog, maksudnya memberikan tanda "Read More..." Atau "Baca Selengkapnya..." ...

Membuat readmore atau menyingkat tulisan di blog, maksudnya memberikan tanda "Read More..." Atau "Baca Selengkapnya..." atau cukup "Selengkapnya..." di bawah tulisan kita yang dipersingkat. Agar tulisan yang panjang tidak seluruhnya tampil biar ga makan tempat.



Langsung saja, di bawah ini merupakan point-point cara menyingkat tulisan di Blogger:



1. Klik layout -> template -> edit HTML. Lalu beri tanda ceklis pada "Expand Widget Templates" Tunggu sebentar.



2. Pada kotak Edit Template cari kode berikut:



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

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



Kode tersebut biasanya ada sedikit kebawah.



3. Kalo sudah ketemu; Tahap pertama (ada dua tahap nih) kita copy-paste kode berikut dibawah kode <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>



Tahap kedua, copas kode berikut,




<a expr:href='data:post.url'>Selengkapnya......</a>

</b:if>





Paste dibawah kode <p><data:post.body/></p>


4. Kalo petunjuk di atas sudah kita lakukan berarti hasilnya seperti ini: (Warna biru sebagai kode yang tadi di copas)

<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'>Selengkapnya...</a>
</b:if>

<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

5. Klik SAVE TEMPLATE.



6. Dari menu TEMPLATE kita pindah menu; klik Settings (Pengaturan) -> Formatting (Format). Dibagian bawah ada tulisan Post Template (Template Posting), isi kotak dipinggirnya dengan kode berikut:




<span class="fullpost">






</span>


Klik SAVE (Simpan Pengaturan).



7. Terakhir, setiap akan memposting klik Edit Html dan sisipkan kode berikut:
<span class="fullpost"> di atas tulisan yang akan kita sembunyikan atau dibawah paragraf tulisan yang kita tampilkan, dan </span> diakhir tulisan.



8. Terakhir, untuk mengedit tulisan yang sudah ada dan pengen menggunakan read more, caranya:


a. Klik menu EDIT POSTS

b. Klik EDIT di artikel yg akan diedit.

c. Pasang kode <span class="fullpost">
di bawah paragraf yg akan ditampilkan. Dan pasang kode </span>
di akhir artikel.



Beres sudah... Silahkan dicoba!

________________

Masih pake template classic...?!? Klik disini cara membuat readmore untuk template classic.

PS: Saat akan mempublish postingan usahakan tidak ada tag </span> lain selain </span> readmore yang ini <span class="fullpost"> dan ini </span>, jika ada akan mengakibatkan terjadi kecelakaan dahsyat readmore tidak berfungsi dengan baik. Caranya edit postingan pada edit html jangan di Compose.

___________
Kampanye Damai Pemilu Indonesia 2009

Kampanye Damai Pemilu Indonesia 2009