Peek A Boo View On Label

Para pembaca sekalian, sila BERI KOMEN yang BERMANFAAT selepas membaca entri ini.

Aku dah lama plan nak tulis tutorial ni. Tapi asyik tak ada masa je. So, memandangkan aku sekarang ni free sebab tak ada kelas petang-petang gini aku pun updated blog ni dengan tulis tutorial ni. Peek A Boo View On Label kalau dalam bahasa melayu: Menu Buka Tutup Di Label. Peek A Boo View On Label lebih kurang macam Read More Versi 2. Kalau klik je mesti terpampang terus kat bawah bukannya akan masuk ke window lain.

Masih tak paham? Cuba lihat contohnya.


01.Login ke Dashboard
02.Klik Layout > EditHTML > Tick Pada Expand Widget Templates
03.Cari code </head> , copy dan paste code berikut di atas </head> tadi.

<script src='http://www.stormpages.com/rojakamoi/hackosphere.js' type='text/javascript'/>

04.Cari code <b:includable id='main' var='top'> dan copy paste code berikut di atas <b:includable id='main' var='top'> tadi.

<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr>
<td width='40px'>
<a href='javascript:void(0)' title='Expand/collapse this post' style='text-decoration:none' expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"'>[+/-]</a>
</td>
<td>
<h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>
</td>
</tr></table>
<div class='post-body' expr:id='data:post.id' style='display:none'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
</b:includable>

05.Cari code ini pula <b:include data='post' name='post'/> , copy dan pastekan code berikut di atas <b:include data='post' name='post'/> tadi.

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<b:include data='post' name='PeekABooPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>

06.Kemudian copy dan pastekan code berikut </b:if> di bawah <b:include data='post' name='post'/> tadi.

#Sebagai tambahan: Jika anda masih mengalami masalah coding-nya sila rujuk code di bawah ini. Code yang berwarna merah anda perlu copy dan paste tetapi bagi yang berwarna lain daripada merah elok la jika anda tidak mengusiknya.

<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr>
<td width='40px'>
<a href='javascript:void(0)' title='Expand/collapse this post' style='text-decoration:none' expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"'>[+/-]</a>
</td>
<td>
<h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>
</td>
</tr></table>
<div class='post-body' expr:id='data:post.id' style='display:none'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
</b:includable>

<b:includable id='main' var='top'>
<!-- posts -->
<div id='blog-posts'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<b:include data='post' name='PeekABooPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>

<b:include data='post' name='post'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:loop>
</div>

Langkah terakhir: Save template dan lihat hasilnya dan klik pada mana-mana Label anda. Trik ini hanya berhasil pada LABEL SAHAJA!!

-Selamat Mencuba-

Via: Eriyza | Muncet