Cara Membuat "read more"

Entah kenapa akhir-akhir ini jadi sering banget otak atik blog, dari ganti templatenya, ngubah kursornya, menjelajah html itu menyenangkan apa lagi kalau yang kita praktekan itu berhasil.

Yuupp...sekian lama mencoba gimana caranya bikin "read more" di blog akhirnya sekarang baru berhasil (hiphiphore). Mencari cari digoogle kemudian dapet dicoba dan gagal, cuma kemaren ini nemu salah satu situs yang lupa namanya apa (sori banget agan..) :m:

Ya walaupun ini dari orang lain cuma gue disini gag ngopi tulisanya ya, gue cuma copy kode nya doank dan membahasnya dengan gaya gue sendiri *asik* :k:

Dengan tampilan dasboard blog yang baru ini kadang kadang membuat kita yang udah sangat amat familiar dengan tampilan lama menjadi sedikit bingung, jadi dalam pembahasan kali ini gue memulainya dari awal, biar gampang juga dimengertinya.

Biar gak berlama lama nich, step nya :

• Pertama ya pasti log in dulu ya ke dasboard kita, gue pake bahasa indonesia biar gag bikin puyeng soalnya. Klik gambar yang disebelah gambar pensil (entri baru) lalu klik template  

Tampilan Dasbor Blog

• Muncul tampilan seperti gambar dibawah ini dan klik bagian "Edit HTML"

Klik Edit HTML

• Setelah diklik akan muncul window yang memuat kata kata yang intinya "kalau kita belum terlalu mahir banget html mending jangan" tapi klik aja "Lanjutkan" dari pada penasaran ya kan :j:

Klik "Lanjutkan"

• Setelah klik tu tombol "Lanjut" jadinya sekarang kita berada di HTML template yang kita pake, sebelom melakukan pengeditan html jangan lupa untuk memberi tanda centang pada "Expand Template Widget" biar nanti kalau ada kesalahan bisa dikembalikan lagi dech (singkatnya gitu)

Centang Expand Widget jangan lupa cek pratinjau sebelum disimpan

Nah sekarang dah tau caranya kan ya masuk ke tamplate html blog, letak-in aja kursor di salam html itu lalu cari </head>  kalau gag mau puyeng nge-cek satu satu buat nyari tu kode tekan aja tombol "ctrl+f" akan muncul kotak kecil yang ada tulisan find nah ketik </head> diisana. Setelah ketemu lalu copy kan kode dibawah ini diatas kode </head>

<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

pas disini nih kadang ada masalahnya,  kadang tulisan kita gag panjang-panjang banget pas bikin readmorenya kelar malah tampil juga semuanya, kamu bisa mengedit berapa jumlah huruf n besar gambar yang ditampilin dengan mengubah  angka pada :summary_noimg = 430;tinggi post tanpa gambar,summary_img = 340;tinggi post dengan gambar, img_thumb_height = 100;tinggi gambar, img_thumb_width = 120;lebar gambar

Lalu cari lagi kode <data:post.body/> lalu ganti kode tersebut dengan kode diberikut 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'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if> 

Selamat mencoba :h: