Cara Membuat Read More pada Blog

Readmore adalah pemenggalan kalimat pada posting suatu halaman, Pemenggalan halaman posting biasanya ditandai dengan "Read More", "Next", "Baca Selanjutnya", "Baca berikutnya", atau "Selengkapnya" .  Readmore biasanya digunakan untuk menandai bahwa kalimat pada posting masih mempunyai kelanjutan, dan juga berguna mempersingkat halaman posting yang panjang. 

Berikut ini adalah cara membuat read more:

Contoh ReadMore :

Anggur memiliki banyak manfaat bagi kesehatan karena mengandung antioksidan dan serat yang tinggi sehingga dapat menjadi sumber energi yang menyegarkan dan berkhasiat mencegah penuaan dini. Selain itu, buah ini mengandung vitamin C, A, B (thiamin), E, dan K (kalium). Vitamin C, selain dapat menyehatkan gusi dan mulut (anti sariawan), juga mengandung aktioksidan yang dapat menjaga imunitas tubuh. Selain dagingnya, biji buah anggur sebenarnya tidak kalah berkhasiat karena mengandung pycnogenol, penguat kolagen untuk kelenturan pembuluh darah. Sedangkan kulitnya kaya akan zat flavonoid yang berfungsi antioksidan. Readmore.. »

Untuk membuat readmore ikuti langkah dibawah ini :

Langkah Pertama:

Buka Template - Edit HTML - Berikan tanda centang pada "Expand widget template"


Langkah Kedua:

Jangan Lupa backup blogger dengan mengklik "dowlnoad template lengkap"


Langkah Ketiga:

Cari kode dibawah ini:
<div class='post-header-line-1'/> <div class='post-body'>

Tips : Untuk mempermudah pencarian kode diatas sebaiknya ikuti tips berikut ini. pertama kamu buka program text editor misalnya notepad.exe ( Pada MS Windows tekan menu Start -> Proggram -> Accessories -> Notepad) kemudian kopy/paste kode HTML tadi ke notepad. kemudian pada notepad pilih Menu Edit -> Find. pada box find masukan kode ini <div class='post-header-line-1'/> kemudian klik tombol Find next. (jika masih gak ketemu terpaksa kita melakukan pencarian secara manual)

Jika sudah menemukan kode diatas, Copy-Paste kode dibawah ini kemudian letakan kode tersebut dibawah kode diatas.




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


Kemudian dibawah kode diatas kita akan menemukan kode:
<p><data:post.body/></p>


Lakukan Copy-Paste kode dibawah ini dibawah code diatas

<a expr:href='data:post.url'>Readmore »»</a>
</b:if>

 

Tips: Kode Readmore diatas bisa ganti dengan kalimat sendiri (contoh "Baca Selanjutnya", "Baca berikutnya", "Selengkapnya")

Kode selengkapnya jika dilihat akan tampak sebagai berikut:

<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'>Readmore »»</a>
</b:if>
<div style='clear: both;'/>

Jika kita mengedit langsung pada halaman blogger Edit HTML dan semua kode diatas sudah dilakukan perubahan, jangan lupa disimpan ya :)

Ini jika kita menggunakan Text Editor Notepad : Setelah melakukan pengeditan kode pada notepad, lalu hapus semua kode yang ada pada halaman edit blogger, kemudian masukan seluruh kode pada notepad tadi dengan cara copy/paste) Sampai disini pengeditan kode selesai, jangan lupa disimpan.

Langkah Empat

Setelah kode diatas disimpan kita kembali dan masuk ke tab Pengaturan -> Format -> cari "Post Template" Kemudian pada kotak masukan kode dibawah ini

<div class="fullpost">
</div>

Jangan lupa disimpan :)


Langkah Kelima :

Disini saya akan menjelaskan cara penggunaan readmore pada halaman posting. Ketika kita melakukan posting pertama kali kita akan melihat kode:

<div class="fullpost">
</div>

ingat jangan hapus kode diatas karena kode tersebut merupakan kode yang akan kita gunakan dalam pemenggalan posting nantinya.

Sebagai contoh lihat cuplikan kalimat dibawah:

Speedyfox adalah software untuk mengoptimalkan kinerja terutama pada saat start up firefox. Software ini sudah saya coba dan bagus sekali untuk kinerja firefox. Cara menjalankannya gampang sekali (tanpa diinstal).(Dini rencana text yang akan dipenggal) Hasilnya akan berbeda dengan mozilla firefox tanpa menggunakan speedyfox. Sangat cocok sekali buat yang memakai modem yang kecepatannya agak lambat.

Bagaimana cara pemenggalan kode diatas? caranya tinggal lihat 2 kode pemenggalan kalimat dibawah (ingat kode hanya bekerja pada halaman editor posting)

Speedyfox adalah software untuk mengoptimalkan kinerja terutama pada saat start up firefox. Software ini sudah saya coba dan bagus sekali untuk kinerja firefox. Cara menjalankannya gampang sekali (tanpa diinstal). <div class="fullpost">  Hasilnya akan berbeda dengan mozilla firefox tanpa menggunakan speedyfox. Sangat cocok sekali buat yang memakai modem yang kecepatannya agak lambat.</div>

Jadi hasil posting pada halaman browser akan tampai sebagai berikut:

Speedyfox adalah software untuk mengoptimalkan kinerja terutama pada saat start up firefox. Software ini sudah saya coba dan bagus sekali untuk kinerja firefox. Cara menjalankannya gampang sekali (tanpa diinstal). Readmore »»

Selamat mencoba teman-teman :) 

Sumber: http://www.o-om.com

Trisnandika Saya orang yang sederhana yang selau ingin berbagi dengan orang lain, dan mencari inspirasi di celah-celah kehidupan.

Berbagi :