Friday 27 April 2018

Mengubah " Newer dan Older post " menjadi Judul posting






Hari ini tanggal 27 april 2018, seperti biasa saya jalan jalan ke blog teman-teman bloger senior untuk mencari apa saja yang kira-kira bisa dimanfaatkan bual blog saya " Hal penting untuk Kita ". Tanpa sengaja saya terpikirkan untuk mengganti Navigasi Postingan saya, yaitu Mengubah " Newer dan Older post " menjadi Judul posting. Bagaimana ya...begitu dalam pikiran saya, lalu saya mulai untuk berkelana, satu demi satu kode yang dibahas diblog diluar sana saya coba, ternyata tidak semua pengcopy artikel mengenai Mengubah " Newer dan Older post " menjadi Judul posting itu memakai apa yang dia tuliskan di blog mereka ( buktinya dipasang Kodenya tidak menunjukan perubahan),ada yang untuk konten saja tanpa perduli apakah kode HTML /Javascript itu bisa diaplikasikan atau tidak ( biasanya ini dilakukan tipe bloger plagiat ) tapi beberapa memang penulis blog Original dengan Ilmu dia menulis. Singkat cerita Bagaimana Mengubah " Newer dan Older post " menjadi Judul posting saya temukan dan trimakasih untuk Mu.. wahai kawan bloger ( namanya tidak disebut karena dari berbagi sumber )

Langkah - Langkah mengubah " Newer dan Older post " menjadi Judul posting :
Buatlah widget baru ( Tambah widget ) dan Pilih dan masukkan kode HTML/Javascript. Lihat contoh pada gambar dibawah ( No.2)
1. Pastikan ada kode jQuery di template blog Anda. Jika belum ada, pasang di atas </head>. 



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

2. Layout > pilih HTML JavaScript
3. Judul kosongkan
4. Copas kode berikut ini di kolom Content:


  
Ini Kodenya :




<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>


Setelah di paste pada Area Konten terakhir tinggal Klik SAVE dan Cek hasilnya.
Catatan :
1. Letakan Gadget ini pada area Footer agar mudah koreksinya.
2. Jika ukuran huruf tidak sesuai dengan keinginan ganti saja ukuran Font - size : 12 px menjadi sesuai keinginan  atau samakan dengan ukuran font postingan.

Contoh Hasilnya bisa dilihat pada gambar teratas.
Semoga membantu.

Popular Posts

Related Posts Plugin for WordPress, Blogger...

My Blog List