Pin It
pada kesempatan ini saya akan membahas cara membuat readmore keren, yang mana ini merupakan jawaban atas pertanyaan teman blogger kita yang menanyakan kepada saya cara membuat readmore keren, baiklah untuk mempersingkat penjelasan mari kita simak penjelasan berikut ini :

1. Silahkan anda Login ID Blogger anda

2. Silahkan Klik Rancangan --> Klik Edit HTML, centang pada kotak Expand Widget Template. 

3. Silahkan anda cari kode seperti ini < /head> kemudian masukkan script di bawah ini persis dibawah kode tersebut.


<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ;summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://deddycamp.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

Keterangan : Tulisan yang berwarna merah adalah yang bisa anda ganti.

  • Summary noimg 430 = tinggi artikel terpenggal tanpa image
  • Summar img 430 = tinggi artikel terpenggal dengan image

4. Cari kode html berikut ini :
      <data:post.body/> atau <p><data:post.body/></p>
, kalau di blog saya saya menggunakan <p><data:post.body/></p>
 
Ganti kode tersebut dengan kode di bawah ini :

<b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;); </script> <span class='rmlink' style='float:right;padding-top:20px;'> <a expr:href='data:post.url'><img alt='read more' src='http://lh5.ggpht.com/_7Y9pl24WpQY/SuM7b-deOLI/AAAAAAAAB_4/PKYOsvyuCdc/readmore_thumb%5B2%5D.png?imgmax=800'/></a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


Keterangan : Tulisan yang berwarna merah adalah link gambar, anda bisa ganti dengan link gambar sesuka anda, untuk mendapatkan gambar animasi Readmore anda bisa lihat Disini


Jika sudah semua silahkan Klik Simpan Template, selesai

Demikianlah Tutorial kali ini, semoga bermanfaat ya :)
 





Artikel Terkait:



17 comments:

  1. wah bisa di coba nh kunjungan baliknya ya www.naufalthedarkness.blogspot.com

    ReplyDelete
    Replies
    1. gan.. yg summary_noimg = 430; . yg diganti 430nya.. atau semuanya(summary_noimg = 430;).

      gw udah ganti(summary_noimg = 430;) jadi 1. tp kok masih berderet kebwah? ampe 10 malah.

      TOLONG Penjelasannya gan. TQ

      Delete
    2. 430nya gan yg di ganti,.
      pastikan mengcopy nya di bawah < /head>


      terus cari code , biasanya ini ada lebih dari 1,. setiap template berbeda2 contohx di template saya berada di tengah,..

      sebaiknya di perhatikan step2 tutorial di atas :)

      Delete
  2. iklan layangnya ganggu pemandangan mas ):

    ReplyDelete
  3. widihhh kren bgt nicchh bisa di coba nichhh

    thank's gan

    ReplyDelete
  4. thx kk informasinya salam kenal http://idegemilang.blogspot.com/

    ReplyDelete
  5. gk bisa guys, udah aku coba berkali-kali

    ReplyDelete
    Replies
    1. ga bisa di bagian mana gan??
      muncul pesan error apa ??
      mohon di periksa kembali

      Delete
  6. mantap bro, keren hasil nya, terimakasih sudah berbagi tips readmore nya

    ReplyDelete
    Replies
    1. sama - sama gan,,.
      sering2 berkunjung dan tunggu tutorial selanjutnya ya :D

      Delete
  7. mantep gan...
    visit: http://putuagem.blogspot.com/

    ReplyDelete
  8. mantap..
    visit: http://rizal4naconda.blogspot.com/

    ReplyDelete

Thanks ya udh ngebaca artikel saya,, Kalau mau ngasih koment yang membangun..
Thanks...

Klik 2 kali untuk keluar