Judul tentang membuat read more mungkin sudah banyak. Sebenarnya, saya tidak pernah punya ide menulis posting tentang read more ini sampai Mbak Project menulis cara membuat "Read More".

Langsung aja ya..., apa sih "read more" itu? tombol "Read More" adalah tombol yang dibuat untuk meneruskan bacaan artikel di blog. Contohnya, seperti yang ada di blog ini. (di bawah)
Read More juga berfungsi sebagai Pemberi Pancingan kepada Blogger lain yang ingin meneruskan bacaan artikel di blog. Isi artikel yang sedikit merupakan pancingan Karena itu, dengan mengklik tombol "read more", Blogger lain bisa melanjutkan membaca seluruh artikel.

Sedangkan, Bagi Pemilik Blog, Read More sangat menguntungkan. Karena, tombol itu bisa menghemat tempat di area posting utama. Tambahan juga, read more bisa menambah page view yang dilihat pemirsanya.

Selanjutnya, Untuk membuatnya tombol read more sangat mudah.....

BABAK KE KESATU. Merubah Kode HTML di menu Edit HTML di Blogger

1. Masuklah ke Blogger.
2. klik menu Tab Layout /Tata Letak.
3. klik Menu Tab Edit HTML.

4. Terus, centang kotak kecil yang ada tulisan Expand Widget Template.

5. Copy kode berikut ini.


<script src='http://mendandaniblog.googlepages.com/Readmore.js' type='text/javascript'/>

<link href='http://mendandaniblog.googlepages.com/ReadMore2.css' rel='stylesheet' type='text/css'/>



6. Kemudian taruhlah kode tersebut di bawah kode:


]]></b:skin>



7. kemudian cari kode berikut ini:


<div class='post-body'>



Kalo tidak ada kode tersebut, cari kode ini:


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



8. Kemudian, gantilah kode itu dengan kode dibawah ini:


<div class='post-body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>



9. Dibawahnya ada kode berikut ini:


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



10. Kemudian, taruhlah kode berikut ini, dibawahnya:


<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><div class='PostDetails' style='float:right'><ul><li class='PostCom'><a expr:href='data:post.url'><span>Read More</span></a></li></ul></div></p>
</span>
<script type='text/javascript'>checkFullundefined&quot;post-&quot; + &quot;<data:post.id/>&quot;)</script>
</b:if>



11. Save Template-mu ..........

Babak ke I telah selesai. Sekarang menuju babak kedua.

BABAK KE DUA. Merubah Setting di Setting Menu di Blogger

1. Pergi ke Tab Setting
2. Dibagian bawah, ada kotak Post Template
3. Kemudian copy dan paste kode di bawah ini ke dalam kotak Post Template itu:


<span id="fullpost">

</span>





4. Simpanlah, dengan meng-klik tombol Save di bawahnya

BABAK KE TIGA. Cara Menulis Posting
1. Ketika menulis posting, semua tulisan yang ada di atas kode di bawah adalah pemberi pancingan.


<span id="fullpost">


Sedangkan, semua tulisan dibawah </span> adalah sisa dari keseluruhan tulisan.
Lihat Gambar dibawah ini yaa..........



Jika sudah selesai menulis, jangan lupa di simpan dan publish, lalu lihat hasilnya.
Oh..iyaa... jika tidak ingin tombol read more terlihat kamu hapus saja kode yang ada di post template.
<span id="fullpost">

</span>

Selesai. Siap dicoba, bagaimana??? berhasilkah?? atau tambah hancur......??!!


10 comments:

  1. Project  

    19 Desember 2008 16.51

    mantabs deh, yang ini lebih komplet dan fleksibel, mo pake gak pake bisa ya kan aya...

  2. project  

    19 Desember 2008 16.55

    Btw ni verivikasi kata di setting off aja biar klo komen bisa langsung, ni saran aja spy lebih komentator friendly

  3. Cahaya Biru  

    19 Desember 2008 17.27

    @Project; Iya, mbak project. Saya akan setting off. Biar komentar friendly... :)

    Mau pake atau ga pake "read more", yang ini bisa. Fleksibel.

  4. ZAHRA, Tasikmalaya  

    25 Desember 2008 16.42

    kenapa ya gak bisa malah error

  5. Cahaya Biru  

    26 Desember 2008 12.50

    @ZAHRA; Erornya anda di mana?

  6. grunge  

    1 Januari 2009 22.37

    kenapa tulisan readmorenya muncul tapi tulisannya ga kepotong

  7. Cahaya Biru  

    2 Januari 2009 13.49

    @Grunge; ketika ngetik, plis jangan pencet tombol compose di Post Template (atau kotak ketikan)....
    Karena, itu bisa merusak HTML dari Read More-nya.... :)

  8. artikel-buket  

    14 Januari 2009 10.55

    keren...tanx ya kk

  9. hasnahasan  

    22 Januari 2009 15.32

    waaah... aku pake ya.. bermanfaat sekali nih ilmunya :)

  10. Gilang Ginanjar  

    14 Maret 2009 21.58

    terima kasih cahaya biru atas tips nya ...
    saya jadi paham membuat read more di blog ...
    meskipun saya sempat bingung karena malah makin ancur ... tapi saya tidak patah semangat ... orang lain bisa, masa saya ngga bisa ???

    pokoknya mah, terima kasih telah mempermudah tugas kuliah saya ...

Posting Komentar

Template Copyright 2009 and Designed By Cahaya Biru