Sharing is Caring

Cara Mengganti Posting Lama dan Posting baru dengan Judul Postingan di Blogspot.

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">
.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>
8. Klik SAVE Widget
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.  

Bagikan :
Back To Top