0 Cara Mengganti Older Post

Ada banyak cara yang bisa dilakukan oleh seorang blogger untuk mendesain tampilan blog-nya, mulai dari desain Header, kotak Posting, Sidebar, Footer ataupun elemen lainnya. Hal tersebut biasanya dilakukan untuk sekedar memberikan penampakan halaman blog yang berbeda daripada umumnya. Seperti juga yang akan kita ulas diposting ini, yaitu bagaimana mengganti objek tulisan Older Posts, Newer Posts dan Home dengan gambar berupa icon kecil agar terlihat lebih menarik serta (mungkin) bisa menambah minat pembaca untuk melakukan klik. Untuk situs blog, objek yang dimaksud tersebut pada umumnya terletak dibagian bawah kotak Posting atau sebelum kotak Footer dan berfungsi sebagai link navigasi untuk menuju kehalaman yang ditunjuk. Pada blog ini bisa kalian lihat penampakannya dibawah kotak komentar posting.

Secara default setelan template blogspot, ke-tiga objek tersebut memanglah ditampilkan dalam wujud teks biasa. Namun kita bisa mudah mengganti ke-tiganya dengan tampilan icon gambar. Bagaimana melakukan itu caranya bisa kalian ikuti panduan berikut ini :

1. Login di Blogspot
2. Pada halaman dashbor blog, pilih setelan "Template" lalu pilih "Edit HTML".
3. Temukan kode seperti ini:

    <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 + &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>
    <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>

Keterangan:
<data:newerPageTitle/> = menyatakan Newer Posts (Posting lebih baru)
<data:olderPageTitle/> = menyatakan Older Posts (Posting lebih lama)
<data:homeMsg/> = menyatakan Home (Beranda/Halaman depan)

4. Ganti ke-tiga kode tersebut dengan URL gambar yang sudah di upload sebelumnya. Contoh penulisan kode-nya menjadi seperti ini :

<a class=’home-link’ expr:href=’data:blog.homepageUrl’><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4oBJQGFQ36bcrPJHpEucuflVaKra71Yw7vIDkzmuCbaB5B2hcAdqX59qe2R1Hb-tYIfzJ3XKkMCIvQPZecpa-5Mfhbx24mX7q60FnmGvNWUVIe2uusXlNuC0mRt-2v9-1-ED-zUVDcz9h/s1600/Home-icon.png"/></a>

Koinfigurasi:
Warna merah adalah URL dari gambar, silahkan ganti sesuai dengan URL gambar kamu masing-masing.  

Untuk memudahkan prakteknya, kamu bisa menggunakan gambar icon dibawah ini. Klik kanan pada masing-masing gambar lalu pilih "Copy Image Location" untuk menyalin alamat URL-nya.

Atau

Atau

5. Jika sudah langkah terakhir tinggal "Simpan Template"

Lebih banyak pilihan gambar icon, bisa kamu download di situs-situs penyedia icon gratis seperti misalnya di IconsPedia.com, IconArchive.com, FindIcons.com, DryIcons.com, dan lainnya.

Selamat mencoba.