membuat auto read more ALA o-om


lanjot yuk bikin tutorial,sehabis jalan dari tempatnya mas tutorial-jitu kita saya langsung kepikiran buat readmore buat blog ini,ehmmm tapi kemana ya?oa kemarenkan baru dapet news letter dari o-om cara ngebuat auto readmore,apa itu mas copy-paste auto readmore?kl kt o-om begini ni


Bila versi terdahulu kita harus meng-cut tulisan menggunakan cara manual dengan melakukan pemangilan fungsi
..
atau .. dimana kode ini biasanya kita tanamkan secara manual kedalam halaman postingan. Untuk versi Auto Read More terbaru kali ini sepertinya lebih canggih lagi, karena fungsi pemenggalan kalimat langsung bekerja secara otomatis tanpa harus menambahkan kode diatas.
Trus..hebatnya lagi, fungsi Read More ini mampu menampilkan image pertama dalam postingan dan mem-fload image tersebut di awal paragraf awal, meskipun gambar yang kita letakan berada di tengah atau akhir postingan. Mungki lebih nyaman saya sebut saja dengan fasilitas image thumbnail.

Tidak hanya itu saja, kita dapat juga pengatur jumlah karakter yang ditampilkan. Disini ada 2 pilihan untuk jumlah karakter. Yang pertama, jumlah karakter yang ditampilkan jika ada image yang diikutsertakan dalam postingan dan yang kedua jumlah karakter tanpa image. Masih bingung maksudnya? sama..yang jelasin juga puyeng wkwkwkw Ya sudah, biar sama2 gak pusing langsung ke tutorialnya saja ok.


jadi intinya beda jauh sama yang read more sebelumnya,kl readmore yang dulu kita harus meletakkan kode
<div class="fullpost">..</div>
atau <span class="fullpost">..</span>
di antara artikel yang akan kita tulis,selain itu kita bisa mengatur jumlah tulisan yang akan muncul hanya dengan mengubah angkanya saja,disana ada 2 bagian yang pertama untuk mematasi seberapa banyak tulisan yang akan kita munculkan dengan adanya gambar dan yang kedua seberapa banyak tulisan yang akan kita tampilkan dengan tdak adanya gambar di postingan kita,ehmmm bingung ya dengan penjelasan saya he.he... ya dah ke tempatnya o-om aja ,kl yang gak bingung kita mulai yuh tutorialnya

pertama
cari code ini bagi yang sudah menggunakan readmore sebelumnya hapus kode yang berwarna merah,tai bila blog anda bl menggunakan readmore sebelumnya makan lanjut ke langkah ke 2


<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;'/>


ke 2
cari code </head> lalu letakkan code dibawah ini di atas kode </head> tadi


<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script src='http://h1.ripway.com/ooms/autoreadmore.js' type='text/javascript'/>


ke 3

save pekerjaan anda

ke 4

Masih pada halaman EDIT HTML, Beri tanda centang pada "Expand widget template" lalu temukan kode seperti dibawah


<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


simpan dan lihat hasilnya,OK

ket :


var thumbnail_mode = "float"; (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel)

1 comments:

November 10, 2011 at 6:56 PM Erialbar

Tq bgt gan

Post a Comment

categories

Blogger Copy Paste One Line Description Avatar Logo Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

Blogger Buster LogoSmashing Logo© Blogger Copy Paste.