Tutorial Tukar Older Post Kepada Icon

Tutorial ini adalah untuk menukar perkataan Older Post pada bawah laman utama blog anda kepada icon agar kelihatan lebih menarik. Anda boleh meletakkan apa sahaja jenis icon pada bahagian ini. Berikut adalah contoh Older Post yang telah ditukar.

Sebelum

Selepas

Contoh Icon :











1. Login ke ID Blogger atau terus ke Dashboard

2. Pilih Layout dan terus ke menu tab Edit HTML

3. Carikan code seperti dibawah

<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></</a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

4. Tukarkan tulisan merah di atas dengan code icon yang disediakan atau code yang anda upload. Setelah menukarkan code merah kepada link code icon, coding tersebut akan kelihatan seperti dibawah ini.

*Untuk mendapatkan icon seperti di atas cuma right click dan copy image location.

<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><img src='http://sites.google.com/site/ssiwidget/Home/BackCustomOrange.png'/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><img src=' http://sites.google.com/site/ssiwidget/Home/ForwardCustomOrange.png'/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img src=' http://sites.google.com/site/ssiwidget/Home/HomeCustomOrange.png'/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

5. Akhir sekali SAVE TEMPLATE dan anda boleh lihat hasilnya.

Selamat Mencuba!!!