Hello mister - sister semua masih inget gak postingan saya sebelumnya yang berjudul Mengganti older post dan newer post dengan judul postingan nah sekarang ada part 2 nya, pembuatnya sekarang admin dari Blogger Tune Up lalu apa spesialnya pada part 2 ini...? sepesialnya pada part 2 ini adalah loading lebih ringan mister - sister semua karena pada part 2 ini programnya menggunakan jquery jadi setelah jquery di load maka judul posting pada Older post dan Newer post akan ter_load atau muncul jadi gak seperti versi 1 atau part 1 nya yang memakan loading cukup lama, mari langsung kita coba.
1. Masukan script di bawah ini di atas
</head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
2. Simpan script pemanggilnya di bawah ini di atas kode
</body>
<b:if cond='data:blog.pageType == "item"'> <script type='text/javascript'> /*! * jQuery Blogger Item Navigation 1.0 * http://modification-blog.blogspot.com/ * Copyleft 2012, Blogger Tune-Up * Dual licensed under the MIT or GPL Version 2 licenses. * Date: Mon May 28 14:54:29 2012 -0500 */ //<![CDATA[ var JudNav = {}; //Fungsi pengambilan judul artikel melalui feed function ambilJudNav(json) { for (var i = 0; i < json.feed.entry.length; i++) { var judul = json.feed.entry[i]; var data = ""; for (var k = 0; k < judul.link.length; k++) { if (judul.link[k].rel == 'alternate') { data = judul.link[k].href; break } } if (data != "") JudNav[data] = judul.title.$t } } //Fungsi penulisan sekumpulan judul feed dengan mengambilnya dari fungsi sebelumnya 'ambilJudNav' document.write('<script type="text/javascript" src="http://' + window.location.hostname + '/feeds/posts/summary?redirect=false&max-results=500&alt=json-in-script&callback=ambilJudNav"></' + 'script>'); //Fungsi Pengambilan Anchor, Pengecekan URL dan Penggantian beberapa simbol function JudulURL(anchor) { var linkurl = anchor.match(/\/([^\/_]+)(_.*)?\.html/); if (linkurl) { linkurl = linkurl[1].replace(/-/g, " "); linkurl = linkurl[0].toUpperCase() + linkurl.slice(1); if (linkurl.length > 28) linkurl = linkurl.replace(/ [^ ]+$/, "...") } return linkurl } //Mengganti 'Posting Lama' dan 'Posting Lebih Baru' dengan fungsi jQuery saat halaman di-load $(window).load(function () { window.setTimeout(function () { var anchor = $("a.blog-pager-newer-link").attr("href"); if (anchor) { var judul = JudNav[anchor]; if (!judul) judul = JudulURL(anchor); if (judul) $("a.blog-pager-newer-link").html(judul) } anchor = $("a.blog-pager-older-link").attr("href"); if (anchor) { var judul = JudNav[anchor]; if (!judul) judul = JudulURL(anchor); if (judul) $("a.blog-pager-older-link").html(judul) } }, 500) }); //]]> </script> </b:if>
3. Masukan kode css di bawah ini diatas kode
]]></b:skin>
.blog-pager-newer-link { background-color: transparent !important; padding: 0 !important } .blog-pager-older-link { background-color: transparent !important; padding: 0 !important } #blog-pager-newer-link { padding: 5px; font-size: 90%; width: 200px; text-align: left } #blog-pager-older-link { padding: 5px; font-size: 90%; width: 200px; text-align: right }
Nah selesailah semuanya anda tinggal buka blog anda dan lihat sudahkah older post dan newer post nya berganti dengan judul postingan seperti pada screenshot / gambar di atas, jika sudah maka berhasilah anda main codingnya mantap semoga bermanfaat Wassalam....
Postingan ini saya update karena posting sebelumnya aku coba belum berhasil kalau yang kali ini di jamin 100% work