Sabtu, 04 Agustus 2012

Cara Membuat "read More + judul Postingan"

Sahabat blogger pasti pernah melihat isi postingan blog teman anda yang ditampilkan hanya sebahagian saja sebagai Over Viewnya dan jika kita tertarik dan ingin membaca selengkapnya kita dapat mengklik link yang biasanya bertuliskan read more atau baca selengkapnya yang berada dibahagian bawah postingan itu. Sebenarnya memang bagus kalu kita menggunakan read more tersebut, habis banyak keuntungannya sih diantaranya keuntungan untuk menghemat layout postingan yang panjang dan memakan tempat mejadi pendek saja, menampilkan langsung banyak postingan tanpa memakan banyak tempat, dan tentunya juga dapat memperindah tampilan blog kita bila ditata dengan baik.

Baiklah jika anda memang tertarik untuk membuat read more ini silahkan ikuti tutorial berikut ini, eps… tapi tunggu dulu soalnya cara membuat readmore yang ingin saya jelaskan kali ini berbeda dengan readmore biasanya. Bedanya apa ayo tebak ? yaps sesuai dengan judulnya Read More yang ingin kita buat kali ini akan ditampilkan dengan di + judulnya lho. Hasilnya kira-kira kayak Read More yang saya pakai ini,silahkan lihat di bagian Home pada blog saya kemudian lihat pada masing-masing postingannya yang menampilkan read more. Baiklah nggak usah basa-basi lagi begini cara membuatnya :

1.Sign In ke account blogger anda
2. di dash board ambil menu [layout] kemudian pilih tab [Edit HTML].
3. beritanda centang pada kotak [“expand widget template”] yang berada diatas kode edit html. Tetapi Jangan lupa untuk memback up template anda terlebih dahulu.caranya klik link [Download Full Template] yang ada di sana.
4. setelah selesai cari kode berikut ini di dalam Template blog anda.Untuk memudahkan pencarian tekan kombinasi tombol [ctrl +f] dan paste kode berikut ini kedalamnya:

<div class='post-body entry-content'>


5. kalau kode tadi sudah ketemu maka dibawahnya akan ada kode berikut ini :

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


6. selanjutnya ganti kode diatas dengan kode berikut ini :
<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>

<strong><a expr:href='data:post.url'>teruskan membaca..... &#8220;<data:post.title/>&#8221; &#160;&#187;&#187; </a></strong>

</b:if>


“Perlu anda ketahui bahwa Tulisan "Lanjutkan Membaca....." ini bisa anda ganti dengan tulisan lain.”
7. setelah selesai simpan hasil pengeditan template yang sudah kita lakukan diatas tadi dengan cara mengklik tombol Save Template
8. Selanjutnya pindah kemenu [setting] dan klik tab [Formatting]
9. kemudian isikan kode dibawah ini kedalam kotak [Post template] yang ada dimenu formatting tadi :
<span class="fullpost">

</span>


10.Lalu simpan hasil perubahan tadi

Proses penyetingan kode Read More telah selesai kita lakukan, sekarang silahkan istirahat sejenak.karena perjalanan kita masih belum selesai.setelah ini kita akan membahsas tentang cara membuat dan menerbitkan postingan dengan Read More. Begini caranya :

1.klik tab postingan yang ada didalam account bloger anda untuk mempositng.
2.didalam kotak tempat anda biasa memposting itukan ada dua Tab. Tab yang pertama bertuliskan [edit html] dan tab yang kedua bertuliskan [compose],nah karena anda telah memasang read more pada template anda maka utuk memanfaatkannya lakukanlah penulisan postingan dibagian [edit HTML] kemudian secara otomatis di bagian edit html tadi akan ada kode seperti dibawah ini :
<span class="fullpost">

</span>


3. tarok artikel postingan yang akan ditampilkan dihalaman utama [sebelum tulisan ["Redmore"] diatas kode ini :<span class="fullpost"> sementara sisa lainnya taruh diantara kode <span class="fullpost"> dengan kode </span>kemudian lakukanlah penyetingan gaya tulisan seperti memberi tautan [hyper link], tulisan cetak tebal [bold], dan susunan tulisan [center,left atau right] seperti biasa yaitu dibagian [compose].
4.setelah selesai,terbitkanlah postingan yang anda buat tadi, dan jangan lupa mengisi judul postingannya ya agar nanti read more dapat menampilkan judul postingan anda juga. Nah kalau anda mengikuti tutorialnyadengan baik maka pasti anda akan berhasil.

Jadi tunggu apalagi burua…nnn… dicoba !!!

0 komentar:

Posting Komentar