Blogger Tutorial: Read More versi Zirah

Contoh read more versi zirah.

ok, skang aku nak buat tutorial read more versi aku nih. kenapa read more versi zirah ea? emm, sebab mungkin aku dah pecah²kan code² read more yang pada asalnya tak menepati kehendak dan citarasa aku. aku tukar² code dia, then jadilah macam yang aku inginkan. sebelum tu, aku mintak maaf sangat² sebab dah lupe sources dan code original. dah lama sangat buat tak ingat dari mana dan siapa. sorry again. huhu~

sebelum bermula, tuto kali ni ada 3 step. kalo boleh follow tiga-tiga step dengan cermat. yela, takut pulaks tak menjadi read more versi Zirah ni. hohoho~

Step 1

ok, first of all, tolong backup dulu blogger template anda. nanti kalo tak jadi kang salahkan daku pulaks. huhu~

kemudian, pegi ke Layout > Edit HTML > Tekan pada Expand Widget Templates > Tekan CTRL F, cari dan cari <div class='post-header'>

Bila dah jumpa <div class='post-header'> tu, gantikan code tersebut dengan code di bawah ni.

<div class='post-header-line-1'/>
<div class='post-body entry-content' expr:id='&quot;post-&quot; + data:post.id'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'><br/>Read More</a></span>
</span>
<script type='text/javascript'>checkFull(&quot;post-&quot; + &quot;<data:post.id/>&quot;); </script>
</b:if>

Contoh seperti di bawah.


*Perasan tak dekat tulisan biru atau tulisan highlight kuning kat gambar tu. kat situ anda boleh tukar apa² perkataan seperti read more, baca lagi, atau anda jugak boleh tukar gambar/button read more disitu. just paste code image anda kat tulisan biru tu.

Lepastu, copy and paste pulak code di bawah dan letakkan selepas ]]></b:skin> dan sebelum </head>

<style>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

Contoh

Terus save kalau takde error.

Step 2

Untuk step 2, kalau step 1 takde masalah dan berjalan lancar, pergi ke Settings > Formatting > Scroll ke bawah sampai jumpa Post Template > Copy and paste code di bawah di kotak ruangan yang disediakan. *tengok contoh.

Your short introduction will be here
<span class="fullpost">

And the rest of your post here
</span>

Contoh

Step 3

Wookeh, da sampai step last sekali. yang paling simple dan berterusan. step 3 ni macam ni. setiap kali anda buat new post, pastikan anda tulis short introduction anda sebelum <span class="fullpost"> dan tulis habis entri anda sebelum </span>. ok, selesai.

urmmm, agak-agaknya depa faham tak apa yang aku mengarut ni? emm, apa-apa je la. kalau ada pape tak paham ke problem ke, just drop some comment kat bawah ok. :)

No comments:

Post a Comment