Cara membuat Readmore di postingan

Postingan Tia kali ini adalah bagaimana Cara membuat Readmore pada postingan, supaya tampilan blog jadi lebih simple n menarik.

Alhamdulillah setelah bolak balik salah n abis 2 bungkus Oreo akhirnya Blog Tia ini resmi menggunakan Readmore, walo bukan yang otomatis coz dengan banyak pertimbangan Tia lebih memilih pake Readmore manual

Thanks buat Kak Lafa dan kak Bagir yang udah banyak sumbang ilmu ke Tia tentang cara pasang Readmore di postingan. Juga buat bang Jagur atas kritiknya dan yang selalu kasi semangat ke Tia supaya jangan menyerah coz ternyata pasang Readmore tuh susah *pucink mode ON*

Read more yang Tia pake udah dimodifikasi sedemikan rupa supaya kakak nga ikutan pucink juga, buat kakak yang udah pasang Readmore di postingan, anggap aja ini selingan sambil minum teh but buat kakak yang minat pasang Readmore kayak Tia, yuk mari kita lanjutkan kak

1. Login ke www.blogger.com, masukin username dan password

2. Klik Layout >> Edit HTML trus klik di Expand Widget Templates

3. Kakak cari kode </head> trus kopas kode berikut tepat di atasnya
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

4. Misi belum selesai kak, berikutnya cari kode ini<data:post.body/> trus kakak kopas juga script yang berikut ini tepat di bawahnya

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<span style='font-weight:bold;'><a expr:href='data:post.url' target='_blank'>
<div style='float:right'><br>Yuk mari lanjut kak...</br>
</div>
</a>
</span>
</b:if>

Yang bisa kakak rubah adalah :
Warna Biru : fungsinya buat buka postingan kakak dalam tab baru, bisa dihilangkan kalo kakak nga suka
Warna Merah : fungsinya agar Readmore kakak rata ke kanan, kalo kakak mo bisa diganti dengan right atau center
Warna Kuning : Tulisan Readmore yang bisa diganti sesuai keinginan kakak

5. Dikit lagi kak, yang terakhir yaitu motong postingan kakak sebagian supaya tampil di blog sesuai keinginan kakak, yaitu dengan menambahkan kode <span class="fullpost"> di batas postingan yang ingin kakak tampilkan dan menambahkan code </span>di paling akhir postingan kakak, nga pucink kan kak

6. Misi selesai kak. Gampang kan

Ada tambahan dikit nih kak, kode <span class="fullpost"> dan </span> bisa di masukan secara otomatis di setiap postingan baru kakak, yaitu dengan klik di Setting >>Formating >> trus kakak kopas kodenya di Post Template n jangan lupa klik Save Setting

Trus kalo untuk postingan-postingan lama kakak, musti agak kerja keras nih, coz motong tampilan supaya menggunakan Readmore sesuai keinginan kakak musti bener-bener manual, mudah-mudahan sih nga terlalu repot ya kak, musti edit satu persatu. Tapi kalo udah jadi, hasilnya sebanding kok dengan capenya kak

uhmm.. masih ada lagi sih kak tambahannya, yang satu ini agak lebih rumit coz untuk kakak yang udah terlanjur bikin postingan menggunakan Compose dan bukan Edit HTML *kayak Tia juga*, masang kode<span class="fullpost"> dan </span> agak lebih beribet coz musti bener-bener diperhatiin naronya n tetep harus pake Edit Html. Misal buat naro <span class="fullpost"> musti di depan kode <div> kalo nga ada ya musti dibikin sendiri kak dan di akhir postingan naro kode </span> harus didepan kode </div> yang paling akhir supaya hasilnya bener kak dan kalo emang nga ada ya musti bikin juga kak, hasil jadinya kurang lebih begini

Batas isi postingan kakak yang mau dipotong<span class="fullpost"><div> sisa postingan nya kakak sampai habis. </span></div>

Hihihihi.. dibaca pelan2 deh kak sambil minum teh pas buka puasa nanti, mudah-mudahan paham maksud Tia ini

Sebenernya ada cara yang lebih mudah masang Readmore di postingan, yaitu dengan pakai Readmore otomatis but karena keterbatasan Tia dalam mengolah script HTML, Tia minta sharing nya aja deh dari kakak-kakak senior

Selama beberapa hari ini Tia nga bikin postingan, coz banyak kesibukan offline yang musti Tia kerjakan, insya Allah setelah ini dengan sedikit merubah penampilan blog * Tia ganti background loh kak* Tia bisa lebih sering lagi sharing ke kakak tentang mempercantik tampilan blog ini. Postingan Tia berikutnya tentang Cara bikin Label Bergerak atau bahasa kerennya Tag Cloud


Pake Readmore tampilan blog jadi lebih cantik, Bener nga sih kak :)