Summary post pada main page blog

Mungkin anda penah tgk main page blog kat blogspot ni ade tulis "Read More..." atau pun kat blog ni sendiri ade tulis "Teruskan bacaan »" bila klik baru lah keseluruhan post muncul. kali ni pulak aku nak berkongsi macam mane nak buat post summary ataupun pendahuluan entry anda.

okay kita terus ke tutorial. malas nak sembang panjang-panjang. tapi macam biasa sebelum buat ni. make sure backup template dulu. just in case anything happen.

XML editing

1. Buat backup template.
   
2. Login ke blogger. kemudian klick tab Layout » Edit HTML.
   
3. Klik checkbox 'Expand Widgets Template'.
   
4. Cari code ini. tekan 'Ctrl+F' untuk short cut.
   

   <div class='post-header-line-1'/>
   <div class='post-body'>

   ataupun
   

   <div class='post-header-line-1'/>
   <div class='post-body entry-content'>

   
   
5. Bawah code tersebut tambahkan coding ini
   

   <b:if cond='data:blog.pageType == "item"'>
   <style>.fullpost{display:inline;}</style>
   <p><data:post.body/></p>
   <b:else/>
   <style>.fullpost{display:none;}</style>

   
   
6. Dibawah code tersebut anda akan jumpa code ini
   

   <p><data:post.body/></p>

   dan di bawah code tersebut tambahkan code ini
   

   <a expr:href='data:post.url'>Read More…</a>
   </b:if>

   
   Read More… itu boleh ditukar dengan perkataan yang anda mahu untuk diklik kemudian menunjukkan entry yang penuh.
   
7. Coding anda akan kelihatan seperti ini.
   

   <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'>Read More…</a>
   </b:if>
   
   

   
   
8. Save Template.
   
9. Tapi kerja anda tak siap lagi. kalau anda priview takkan jadi lagi. ade satu lagi yang perlu dilakukan.
   Di setiap post anda mesti di edit untuk tambah coding ini
   

   Pendahuluan (ini akan muncul di main page)
   
   <span class="fullpost">
   
   Content blog anda (bahagian ini di sembunyikan pada main page)
   
   </span>
   

10. Tambahkan coding tersebut dalam "Post Template"
    caranya klik tab Setting » Formatting. dibawah sekali terdapat satu text area yang bernama Post Template. masukkan coding diatas seperti ini. save settings anda.
    
    tujuannya setiap kali anda klik new post code ini dah ade dalam post anda. anda hanya perlu isikan pendahuluan dengan content entry anda.
    

Jika anda mempunyai masalah trick ini tidak menjadi. anda boleh la mencuba dengan mencari code

<p><data:post.body/></p>

kemudian masukkan code di atas dan di bawah code ini seperti no.7 di atas. code yang di'merah'kan adalah code yang perlu ditambah.

Selamat mencuba!

Tutorial Blogger