Mengganti navigasi Halaman dengan judul posting

Cara mengganti navigasi halaman dengan judul posting, hal ini sering juga di sebut dengan , Cara mengganti older dan newer pos dengan judul posting atau Cara mengganti navigasi Next dan Prev dengan judul posting/artikel.

Navigasi halaman adalah alat untuk mengunjungi halaman atau postingan selanjutnya/berikutnya, posisi navigasi halaman letaknya di baagian bawah artikel/postingan atau di atas footer, Contohnya seperti gambar di bawah ini :

Dengan melihat contoh gambar di atas admin jasa desain website yakin pembaca yang budiman disini sudah paham yang di maksud dalam panduan Cara mengganti navigasi halaman dengan judul posting.

Sebelum melangkah cara pembuatannya disini sedikit saya beritahukan bahwa navigasi sebuah website atau blog ini sangat penting karena dengan Tombol navigasi akan memberikan kemudahan bagi pengunjung situs.

Seperti Google pun dengan situs ppc layanan periklanan internet yaitu Google Adsense juga menerapkan keharusan bagi pelamar google adsense harus menyediakan alat Navigasi dalam situs masing-masing.

Navigasi website selain navigasi halaman juga banyak tombol navigasi yang harus di lengkapi dalam membuat website yang di antaranya sitemap atau daftar isi , back to top , readmore dan navigasi yang laainya.

Cara membuat atau mengganti Navigasi halaman dengan judul posting ada beberapa cara dengan cara meletahkan script kode kode kedalam htm dan dengan cara melalui widged.

Dalam panduan website kali ini saya akan memberikan cara mengganti navigasi next - prev dengan widged sehingga menurut saya akan lebih mudah.

Contoh dari navigasi halaman older dan newer yang sudah di ganti dengan judul posting bisa dilihat seperti gambar di bawah ini

Navigasi halaman dengan judul posting

Untuk Cara pembuatanya silahkan simak panduannya di bawah ini :

Cara mengganti navigasi halaman dengan judul posting

1.buka blog anda melalui blogger.com lalu login ke akun masing-masing

2.klik desain unutuk menuju dashboard blogger

3.dalam dashboard blog pilih tata letak
4.lalu klik tambahkan gadged dan pilih gadged HTML/javascript
5.selanjutnya kopi kode di bawah ini dan pastekan dalam gadged HTML/javascript

<style type="text/css">
.home-link{display:none}
#blog-pager-newer-link {font-size:14px;width:300px;float:left; text-align:left;font-family:Arial, sans-serif;}
#blog-pager-older-link {font-size:14px;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>

keterangan :

• Angka 14 dalam kode di atas adalah ukuran besarnya (font) tulisan , jika kurang pas silahkan sesuaikan
• Angka 300 pada kode di atas sebagai ukuran panjang sisi kanan dan sisi kiri tombol navigasi , jika tidak pas dengan template anda silahkan sesuaikan

6.Selanjutnya silahkan simpan gadged nya
7.silahkan coba dulu hasilnya dengan membuka ulang salah satu postingan anda dan lihat pada menu navigasi postingnya ( letaknya di bawah akir postingan ) jika sudah berubah navigasinya menjadi judul postingan dan bisa diklik maka perubahan navigasi postingnya sudah selesai , Namun jika setelah di Klik tidak berubah maka harus menambahkan kode satu lagi.

Silahkan copi kode di bawah ini dan pastekan di bawah kode </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

cara meletahkan kode ke dua ini di bawah </head >

1.buka blog anda lalu login
2.dalam dashboard blog pilih Template dan klik edit html
3.Lalu kopi kode yang kedua tersebut dan pastekan di bawah kode </head>
4.selanjutnya simpan template nya
5.selesai

Demikian panduan website kali ini tentang Cara mengganti navigasi halaman next dan prev dengan judul posting, Selamat mencoba semoga berhasil , jika kesulitan silahkan untuk bertanya saja.