Membuat Split Post Pada Blogspot

Mungkin ada yang bertanya-tanya *seperti saya*. Bagaimana mengatur tampilan hasil postingan di main page dengan tampilan sebagian postingan dengan "baca selengkapnya" or "Click here to read more" pada akhir postingan seperti pada halaman ini.

Bagi pengguna Wordpress hal ini tidak menjadi masalah karena WP sudah menyediakan layanan ini. Tapi bagi pengguna Blogspot seperti saya, hal ini menjadi tantangan tersendiri, karena Blogger tidak menyediakan layanan ini.

Contohnya seperti halaman ini ada tulisan "Click here to read more" di bagian bawah untuk menampilkan halaman postingan secara keseluruhan..

Setelah sekian lama mencari, mencoba akhirnya saya menemukan caranya..

Langkah pertama yang harus anda lakukan adalah:
Pastikan "individual post page" blog anda adalah enabled. Caranya dengan masuk ke Dashboard pada blogger anda, pilih tab SETTINGS, kemudian ARCHIVING dan pastikan ENABLE POST PAGES di-set YES.

Setelah itu perlu dilakukan modifikasi pada template anda, masuk ke tab TEMPLATE, pilih EDIT HTML,pada bagian EDIT TEMPLATE, pastikan tanda cek pada "Expand Widget Template" aktif, barulah kita bisa melakukan modifikasi. Tapi sebelum dilakukan modifikasi, anda harus melakukan Backup/Restore Template tuk menghindari terjadinya error pada saat dilakukan modifikasi nanti.

Pada window edit template, akan ditampikan kode html. Carilah kode di bawah ini:

<div class="post-body">

tambahkan dibawahnya kode di bawah ini

<!-- post summary hack begin -->
<b:if cond="data:blog.pageType == "item"">
<style>.fullpost{display:inline;}</style>
</b:if><p><data:post.body></data:post.body></p>
<b:else>
<style>.fullpost{display:none;}</style>
<!-- post summary hack end -->
</b:else>

cari kode seperti ini di bagian selanjutnya:

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

terus tambahkan kode berikut ini di bagian bawahnya, kalimat "Click Here to Read More.." bisa anda ganti dengan "baca selengkapnya" or dll, terserah anda.

<!-- post summary hack begin -->
<a href="data:post.url">Click Here to Read More..</a>

<!-- post summary hack end -->

Setelah anda melakukan modifikasi pada tempat yang telah saya sebutkan tadi maka tampilan keseluruhan akan menjadi seperti ini:

<div class='post-body'>

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


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

<!-- post summary hack begin -->
<a expr:href='data:post.url'>Click Here to Read More..</a>
</b:if>
<!-- post summary hack end -->

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

</div>


Setelah selesai SAVE template anda.
Langkah selanjutnya adalh memodifikasi postingan anda, ketika anda melakukan posting tambahkan kode seperti berikut ini:

Ini adalah awal postingan anda dan akan dipotong disini. <span class="fullpost"> Ini adalah akhir postingan saya </span>

Selamat Mencoba !!!!!

CATATAN:
cara ini tidak berlaku untuk CLASSIC TEMPLATE

SUMBER:
beberapa sumber yang bisa dijadikan referensi
- blogger-tricks.blogspot.com
- www.isnaini.com
- blogger help