Tutorial: Cara membuat Auto Read More pada entri

Assalamualaikum dan salam sejahtera semua...


Baiklah kepada blogger yang dah pasang auto read more tu memang mereka dah tau keseronokan aplikasi ini. Auto read more merupakan aplikasi blog yang berfungsi secara automatik ke atas entri-entri yang diterbitkan menjadi sekerat (potongan) entri...kelebihan lainya pula gambar pada entri-entri akan menjadi kecil jika dilihat pada paparan halaman utama blog.


Contoh aplikasi auto read more yang aku print screen dari blog aku ni...

Entri nampak kemas dan teratur....jom ikut step by step...


Langkah 1:


Pergi ke design --> Edit HTML --> Expand Widget Templates


Langkah 2:


Tekan Ctrl+F, papan search akan keluar serta merta. Cari </head> pada ruangan papan search tadi.


Langkah 3:


Copy kod HTML di bawah ni dan paste di atas </head> yang korang cari tadi tu.


<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 230;
summary_img = 300;
img_thumb_height = 150;
img_thumb_width = 150;
</script>
<script src='http://keerthiset2.110mb.com/excerpt.js' type='text/javascript'/>


Langkah 4:


Cari <data:post.body/> pada ruangan papan search then kalau dah jumpa korang gantikan <data:post.body/> tadi tu kepada <div class='post-body entry-content'> (maksudnya korang replace)


Langkah 5:


Copy kod HTML di bawah ni dan paste di bawah kod yang korang replace tadi tu.


<b:if cond='data:blog.pageType != &quot;item&quot;'><br/> <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><br/> <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://www.consumerguardian.org/images/CG_Button_ReadMore.gif'/></a></span><br/> </b:if><br/> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


Langkah 6:

Preview dulu. Kalau dah ok tekan save.


Good Luck!



Panduan:

• Warna jingga: Mengubah saiz tinggi gambar.
• Warna biru: Mengubah saiz lebar gambar.
• Warna merah: 'Read More' button..yang ni kalau korang nak ubah pun boleh tapi mestilah bersesuaian dengan saiznya.

*Jika ada sebarang pertanyaan, korang boleh ajukan pertanyaan di ruangan komen entri ni.