Hosting Gratis
Klik ini sob » Home » , , , , , » edit readmore secara full

edit readmore secara full

By Ekka gates comunity | Senin, 26 Desember 2011

Ayo sobat Ekka,mari saling berbagi :
Blogger Read More
 Wah readmorenya default terus,,,gimana ya biar lebih menarik???
Nah nie Ekka ada caranya sob,jangan khawatir sob Ekka pasti bisa membantu qo
 
Pendahuluan
Read more dipasang untuk memotong tulisan panjang dalam satu posting sehingga hanya beberapa kalimat yang akan ditampilkan, sisanya akan terlihat setelah read more diklik.

Read more biasanya dipasang di halaman depan yang terdapat banyak posting dalam bentuk gambar atau teks seperti Read More,

A. Merubah tulisan "Read More - Judul Posting" menjadi kalimat sendiri

  1. Sebelum melakukan trik ini, sebaiknya backup dulu template blog untuk jaga-jaga kalau terjadi kesalahan.
  2. Masuk ke Design, pilih Edit HTML, centang Expand Widget Templates di atas kotak editor.
  3. Cari kode <span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span> kalau kesulitan tekan CTRL+F.
  4. Ganti kode berwarna merah dengan kalimat Anda sendiri misalnya Baca Selengkapnya, Selanjutnya, More >>, dan sebagainya. Jika akan menambahkan beberapa simbol misalnya tanda lebih besar, gunakan penulisan entitas HTML. 
  5. Save Template dan lihat hasilnya.
B. Merubah tulisan "Read More - Judul Posting" dengan gambar<
  1. Lakukan langkah 2-3.
  2. Ganti kode berwarna merah dengan <img src="url gambar" alt="readmore"/>. Yang berwarna merah adalah alamat file gambar read more yang telah disiapkan sebelumnya.
  3. Save Template dan lihat hasilnya.
C. Merubah posisi read more dari sebelam kiri ke sebelah kanan
  1. Lakukan langkah 2-3.
  2. Ganti kode berwarna pink dengan style='float:right'.
  3. Save Template dan lihat hasilnya.
D. Mengatur jumlah karakter dan ukuran gambar
  1. summary_noimg = 250; (250 adalah jumlah karakter yang akan ditampilakn sebelum read more jika pada postingan tidak terdapat image/ gambar)
  2. summary_img = 250; (250 yang ini juga adalah jumlah karakter yang akan ditampilkan sebelum read more tetapi pada posting yang ada gambarnya)
  3. img_thumb_height = 120; (ukuran tinggi gambar dalam pixel)
  4. img_thumb_width = 120; (ukuran lebar gambar dalam piksel)
E. Memperbaiki ratio gambar (perbandingan lebar dan tinggi)
Jika script auto read more tersebut langsung dipakai tanpa diedit terlebih dahulu, maka default gambar yang tampil akan berbentuk bujur sangkar ukuran 120 x 120 pixel. Bayangkan jika foto atau gambar persegi panjang dipaksa tampil dalam bentuk bujur sangkar, gak enak kan? Masa cantik-cantik kok mlenuk. Agar terlihat sedikit professional maka perbandingan lebar dan tinggi gambar harus tetap sesuai. Caranya dapat dilakukan dengan membuat salah satu (width atau height) menjadi auto. Berikut langkah-langkahnya:
  1. Masuk ke Design, pilih Edit HTML, centang Expand Widget Templates di atas kotak editor.
  2. Cari kode Java Script berikut {
    imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
    summ = summary_img;
    }
  3. Ganti salah satu kode berwarna merah dengan auto (slalah ssatu saja).
      4.save template

Nah sob,cukup mudahkan edit readmorenya . . .low bingung kasih komentar ya sob . . ...



Attention
Tolong baca Sobat Ekka !

Hay sobat,gimana bacaan artikel diatas,menarik bukan.Tapi inget jangan hanya kopas ya sobb.kasih komentar juga atau isi buku tamunya biar tambah ramai,,makasih sobatthanks

GET UPDATE VIA EMAIL
Dapatkan kiriman artikel yang terbaru
Dari Kami langsung ke email anda!

0 komentar:

Posting Komentar

Hai sobat Ekka,kasih komentar kalau tidak mudeng ok . .

Silahkan berikan komentar sobat, kritikan atau saran sobat mengenai artikel di atas untuk mendapatkan backlink gratis dari Your Blog ini. Komentar yang tidak sesuai topik, SPAM, Penghinaan, dsb terpaksa akan Ekka hapus ! Tanks be 4,,.

Close
Related Posts Plugin for WordPress, Blogger...

Ariescom 07

Original design by: ekkagatez.blogspot.com - ekkagatez.blogspot.com - 2011

Move your mouse to go back to the page!
Hey sobat...jangan pergi dulu gerakin aja lagi mousenya,nah gitu dong!
 
Home | About Us | | Advertise with Us | Free Blogger Templates | Widget | Site Maps
Copyright © 2010 - 2012. Pusat-cara.blogspot.com - All rights reserved | Proudly Powered by Blogger.com
Website Design by Ariescom 07 | Sponsored by www.ekkagatez.blogspot.com