Cara Mengganti Posting Lama dan Posting baru dengan Judul Postingan di Blogspot. Seringkali kita menemukan template dengan navigasi yang simple di mana
navigasi postingan lama dan postingan baru di letakan di bawah komen dengan
judul <- NEWER (Postingan Baru) atau Older-> (Postingan Lama).
Secara
umum hal ini sebenarnya tidak masalah. Karena ketika pembaca mengklik tautan
NEWER maka akan di tautkan ke halaman artikel yang lebih baru dari halam yang
terbuka, begitu pula sebaliknya. Yang menjadi masalah adalah, pembaca tidak
tahu halaman berikutnya itu membahas tentang apa. DI sinilah kadang kita merasa
terjebak. Apalagi jika blog yang kita baca adalah blog gado-gado di mana kadang
artikel yang satu dengan artikel yang lain tidak saling berhubungan.
Dengan
memikirkan kenyamanan pembaca inilah maka sebaiknya kita mengganti navigasi
Postingan Lama dengan Postingan Baru dengan judul postingan itu sendiri.
Bagaimana caranya? Berikut ini, Jeng PIO akan membantu anda step by step cara
merubah navigasi Postingan lama dan Postingan baru dengan Judul Postingan.
Cara Merubah Postingan Lama dan Postingan Baru sebenarnya sangat mudah. Jika
anda berminat untuk mengganti navigasi Posting baru dan Posting lama dnegan
judul posting dapat mengikuti tutiral step by step berikut ini:
1. Masuk ke Akun BLOGGER anda
2. Pilih Blog yang akan di ganti navigasinya
3. Di menu pilih TEMPLATE
4. Tambahkan CODE jQuery berikut ini di bawah kode </head>. Untuk
mempermudah mencari kode </head> baca artikel Ccara mencari Kode di
template Blogspot.
Kode jQyury:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>5. Klik SAVE
6. DI Menu, pilih LAYOUT
7. Klik Add a Gadget, pilih HTML/Java Script, lalu Tambahkan kode HTML berikut ini kedalam Widget:
<style type="text/css">8. Klik SAVE Widget
.home-link{display:none}
#blog-pager-newer-link {font-size:12px;width:300px;float:left; text-align:left;font-family:Arial, sans-serif;}
#blog-pager-older-link {font-size:12px;width:300px;float:right; text-align:right;font-family:Arial, sans-serif;}
</style>
<script type="text/javascript">
$(document).ready(function(){
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link").text();
$("a.blog-pager-older-link").text(olderLinkTitle + "\u2192");//rgt
});
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
$("a.blog-pager-newer-link").text("\u2190" + newerLinkTitle);
});
});
</script>
9. Klik SAVE ARRAGEMENT
10. Klik View BLOG
Langkah terakhir berungsi untuk melihat apakah penggantian navigasi postingan
Lama dan Postingan Baru berhasil atau tidak. Jika berhasil maka judul navigasi
yang Posting Lama/Posting baru akan berubah menjadi judul postingan seperti
gambar di bawah ini.
