Mengubah Navigasi Posting Lama/Posting Baru menjadi Berikutnya/Sebelumnya
Sebelum memasuki langkah perombakan, paling tidak kamu harus mengerti terlebih dahulu mengenai tiporafi navigator halaman blogspot. Berikut ini adalah contohnya (yang hanya bisa kamu lihat setelah kamu mengecek Expand Template Widget):
Seluruh kode di atas merupakan kerangka objek (sebut saja begitu) dari sebuah navigator halaman. Kode yang Saya beri warna biru mewakili navigasi Posting Lebih Baru, kode yang Saya beri warna merah mewakili navigasi Posting Lama, sementara kode yang Saya beri warna hijau mewakili navigasi Beranda yang umumnya disisipkan di tengah navigator.
Karena template blogspot berbasis XML, maka kamu tidak akan menemukan teks bertuliskan "Posting Lama" atau "Posting Lebih Baru" di dalamnya. XML adalah sistem perwakilan. Wujudnya hanya berupa tag yang nilainya akan berubah sesuai dengan setting dalam dasbor blogmu.
Logikanya begini: Saat kamu mengubah setting bahasa antar muka menjadi bahasa Inggris, maka secara otomatis elemen navigasi Posting Lama dan Posting Lebih Baru akan berubah menjadi Older Post dan Newer Post.
Tag-tag XML tersebut bisa Saya kategorikan seperti ini:
Untuk mengubah Posting Lama, Posting Lebih Baru dan Beranda, caranya cukup dengan mengganti kode-kode tersebut saja menjadi seperti ini:
Sekarang kamu bisa menyimpan templatemu.
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' 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 + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
<div class='clear' />
</b:includable>
Seluruh kode di atas merupakan kerangka objek (sebut saja begitu) dari sebuah navigator halaman. Kode yang Saya beri warna biru mewakili navigasi Posting Lebih Baru, kode yang Saya beri warna merah mewakili navigasi Posting Lama, sementara kode yang Saya beri warna hijau mewakili navigasi Beranda yang umumnya disisipkan di tengah navigator.
Karena template blogspot berbasis XML, maka kamu tidak akan menemukan teks bertuliskan "Posting Lama" atau "Posting Lebih Baru" di dalamnya. XML adalah sistem perwakilan. Wujudnya hanya berupa tag yang nilainya akan berubah sesuai dengan setting dalam dasbor blogmu.
Logikanya begini: Saat kamu mengubah setting bahasa antar muka menjadi bahasa Inggris, maka secara otomatis elemen navigasi Posting Lama dan Posting Lebih Baru akan berubah menjadi Older Post dan Newer Post.
Tag-tag XML tersebut bisa Saya kategorikan seperti ini:
Kode | Perwakilan |
---|---|
<data:newerPageTitle/> | Mewakili Posting Lebih Baru |
<data:olderPageTitle/> | Mewakili Posting Lama |
<data:homeMsg/> | Mewakili Beranda |
Untuk mengubah Posting Lama, Posting Lebih Baru dan Beranda, caranya cukup dengan mengganti kode-kode tersebut saja menjadi seperti ini:
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'>Berikutnya</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 + "_blog-pager-older-link"' expr:title='data:olderPageTitle'>Sebelumnya</a>
</span>
</b:if>
<a class='home-link' expr:href='data:blog.homepageUrl'>Halaman Depan</a>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
<div class='clear' />
</b:includable>
Sekarang kamu bisa menyimpan templatemu.
8 Comments:
mas aku mau tanya diblog ku kenapa nggak ada navigasi berikutnya, pas dibagian Home, aku liat dibawah nggak ada, tapi pas aku buka salah 1 postingan aku baru ada, tolong ya mas dibantu...
By Dwie AZzahra, at Monday, August 8, 2011 at 2:00:00 PM GMT+7
saya takut kalo urusan sama kode beginian, belum biasa
By Muhammad A Vip, at Monday, August 8, 2011 at 2:50:00 PM GMT+7
@Dwie AZzahra: Sistem efisiensinya memang begitu. Coba pikir: Saat di halaman muka bukankah yang kamu lihat adalah posting terbaru? Untuk apa templatemu repot-repot mencantumkan navigasi Posting Lebih Baru jika ketika diklik tidak akan pergi ke mana-mana? Posting terbaru adalah posting yang paling awal, jadi tidak akan ada posting lagi di depannya. Itu adalah salah satu fungsi tag kondisional <b:if cond='data:newerPageUrl'>
By Taufik Nurrohman, at Monday, August 8, 2011 at 3:14:00 PM GMT+7
makasih mas udah bisa..!!
By Dwie AZzahra, at Monday, August 8, 2011 at 5:31:00 PM GMT+7
Malam kak, aku mau tanya, kalau expr:title='data:newerPageTitle' diganti dengan judul postingan selanjutnya gimana caranya, saat ini yang tampil kan halaman berikutnya ato posting lama, mohon pencerahannya ?
By IRIL SAGITA, at Sunday, September 9, 2012 at 10:06:00 PM GMT+7
Pakai JavaScript. Cari saja di Google. Ada banyak tutorialnya.
By Taufik Nurrohman, at Sunday, September 9, 2012 at 10:11:00 PM GMT+7
kalo navigasinya dipisah dari posting gmana caranya mas?
By Admin, at Monday, June 10, 2013 at 11:39:00 AM GMT+7
Mantap.....bisa ditambah, makasih Bang...
By Unknown, at Thursday, February 19, 2015 at 9:36:00 AM GMT+7
Post a Comment
<< Home