Pembaharuan: 06 Januari 2017
Pada hasilnya Saya menemukannya, seorang pencetus JSON Blogger dengan sistem navigasi halaman. Beliau berasal dari Spanyol (Vagabundia). Pada dasarnya cara kerja navigasi widget ini di dalam mengontrol JSON hanyalah dengan cara mengubah nilai parameter start-index
secara tidak langsung:
http://nama_blog.blogspot.com/feeds/posts/default?start-index=1&max-results=10&orderby=published&alt=json-in-script&callback=yourfunction
Kode di atas akan menampilkan posting terbaru dengan keadaan normal ialah mulai dari posting pertama (start-index=1
) dan berhenti pada posting ke sepuluh (max-results=10
). Namun, dengan cara mengubah nilai start-index
, Anda dapat memanggil posting dari urutan berapapun meski bukan dari urutan pertama. Misalnya:
http://nama_blog.blogspot.com/feeds/posts/default?start-index=17&max-results=10&orderby=published&alt=json-in-script&callback=yourfunction
Dengan cara itu, maka posting yang ditampilkan akan dimulai dari posting ke 17 (start-index=17
) dan akan berhenti pada posting ke 27 (max-results=10
).
Hal itulah yang dilakukan oleh navigasi JSON, yang hanya akan mengubah nilai start-index
untuk meloncat dari halaman yang satu ke halaman yang lainnya, bahkan tanpa harus memuat halaman secara keseluruhan:
Saya telah memodifikasinya untuk memperkaya konten. Selain judul dan thumbnail, Saya juga telah melengkapinya dengan ringkasan posting, keterangan komentar dan bulan terbit artikel. Selain itu, widget ini juga dapat difilter menurut nama label tertentu.
Memasang Widget Daftar Isi pada Blog Anda
Di sini Saya memakai tema hijau dan putih. Mungkin Anda tidak suka dengan tampilannya, tapi jikalau Anda berminat, cukup tuliskan harapan pada formulir komentar di bawah mengenai tema apa lagi yang sekiranya elok untuk widget ini. Jika ada kesempatan niscaya akan Saya buat tema-tema yang gres untuk widget daftar isi ini atau juga widget-widget lainnya yang ada di blog ini.
Edit: Tema-tema selengkapnya dapat Anda lihat di sini »
Untuk membuatnya, pertama-tama klik hidangan Laman pada sidebar. Kemudian, pada hidangan Laman Baru pilihlah Laman Kosong:
Setelah itu Anda akan melihat formulir halaman statis menyerupai ini. Klik mode HTML:
Salin aba-aba di bawah ini kemudian letakkan di dalam formulirnya:
<link rel="stylesheet" href="//tovic.github.io/dte-project/blogger-toc-with-pagination_default-theme.css"/> <script> var showPostDate = true, showComments = true, idMode = true, sortByLabel = false, labelSorter = "jQuery", loadingText = "Loading...", totalPostLabel = "Jumlah posting:", jumpPageLabel = "Halaman", commentsLabel = "Komentar", rmoreText = "Selengkapnya ►", prevText = "Sebelumnya", nextText = "Berikutnya", siteUrl = "http://nama_blog.blogspot.com", postPerPage = 10, numChars = 370, imgBlank = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC"; </script> <script src="//tovic.github.io/dte-project/blogger-toc-with-pagination.js"></script>
Ganti URL http://nama_blog.blogspot.com dengan alamat blog Anda kemudian simpan.
Pengaturan
Opsi | Nilai | Keterangan |
---|---|---|
showPostDate | true | Ganti nilainya menjadi false jikalau Anda tidak ingin menampilkan bulan terbit artikel. |
false | ||
showComments | true | Ganti nilainya menjadi false jikalau Anda tidak ingin menampilkan jumlah komentar pada artikel. |
false | ||
idMode | true | Jika bernilai true , sistem penaggalan artikel akan menjadi berbahasa Indonesia. Jika bernilai false sistem penanggalan artikel akan bermetamorfosis berbahasa Inggris. |
false | ||
sortByLabel | true | Digunakan untuk memfilter artikel/posting. Jika ingin menampilkan posting dengan kategori tertentu saja, pilihlah nilai true . Setelah itu tentukan nama label pada variabel labelSorter . |
false | ||
labelSorter | "JavaScript", "Widget", ... (nama label) | Tentukan nama label jikalau opsi sortByLabel bernilai true . |
totalPostLabel | "Jumlah posting:", ... (teks) | Tentukan keterangan jumlah posting (yang di bawah navigasi). |
jumpPageLabel | "Halaman", ... (teks) | Tentukan keterangan lompatan posting (yang di bawah navigasi). |
commentsLabel | "Komentar", "Comments", ... (teks) | Digunakan untuk memilih label jumlah komentar (contoh: 10 Komentar). |
rmoreText | "Baca Selengkapnya", "Read More", ... (teks) | Digunakan untuk memilih label link menuju posting asli. |
prevText | "Sebelumnya", "Previous", ... (teks) | Digunakan untuk memilih label navigasi mundur. |
nextText | "Berikutnya", "Next", ... (teks) | Digunakan untuk memilih label navigasi maju. |
siteUrl | (URL Blog) | Ganti URL ini dengan URL blog Anda. |
postsPerPage | 10, 30, ... (numerik) | Digunakan untuk memilih jumlah posting yang tampil pada satu halaman. |
numChars | 100, 200, ... (numerik) | Digunakan untuk memilih jumlah huruf ringkasan posting. |
imgBlank | no-image.jpg (URL Gambar) | Gambar cadangan jikalau posting yang tampil tidak mempunyai gambar. |