Membuat Halaman Arsip Statis Blogger

Halaman arsip statis pada disini maksudnya adalah membuat Blogger Static Archive Page yang biasanya dapat sobat tambahkan melalui add gadget pada menu Layout, kita buat halaman statisnya (static page), tentu saja sebelum melakukan ini sobat harus mengetahui bagaiaman caranya menambahkan halaman statis dalam Blogger.

Tujuan yang ingin di dapat dari pembuatan halaman ini adalah untuk menampilkan semua arsip tulisan yang ada pada website atau blog yang kita punya, biasanya jika kita tambahkan archive page dari menu add gadget, secara otomatis arsip artikel akan terbagi dalam tahun dan bulan, mungkin untuk jelasnya sobat bisa lihat hasil akhir yang muncul seperti pada gambar berikut:

Bagaiamana? cukup bagus kan, jadi jika pembaca yang berkunjung ingin melihat apa saja tulisan artikel yang ada dalam sebuah blog atau website sobat, mereka tinggal klik halaman arsip tersebut dan semua artikel yang pernah dibuat akan muncul beserta tanggal dan label yang digunakan, serta diurut berdasarkan tanggal posting terbaru.

Caranya terbilang cukup mudah, pertama tambahkan halaman baru dari dashboard dengan klik Page kemudian New Page, berikan nama sesuai dengan keinginan, misalnya Arsip, setelah itu tambahkan kode dibawah pada halaman tersebut dan hasilnya bisa langsung dilihat.

<style>
#bp_toc {
 border: 0px solid #000000;
 padding: 5px;
 width:100%;
 margin-top:10px;
}
.toc-header-col1, .toc-header-col2, .toc-header-col3 {
 background: #fff;
 color: #000000;
 padding-left: 5px;
 width:60%;
}
.toc-header-col2 {
 width:20%;
}
.toc-header-col3 {
 width:20%;
}
.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {
 font-size:14px;
 text-decoration:none;
}
.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
 font-size:14px;
 text-decoration:underline;
}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {
 padding-left: 5px;
 font-size:14px;
}
</style>

<div id="bp_toc">
Memanggil Halaman Arsip, Harap Tunggu Sebentar....</div>
<script src="https://googledrive.com/host/0BxB6KSTbkhgBN21qaUp4RkIyWHc" type="text/javascript">
</script>
<script src="/feeds/posts/summary?alt=json-in-script&max-results=500&callback=loadtoc" type="text/javascript">
</script>

Oh ya awalnya javascript yang digunakan adalah:

http://bloggergadgets.googlecode.com/files/blogtoc_orig.js

Tetapi karena Google telah meng-informasikan bahwa nantinya google code akan di bekukan, maka penulis berinisiatif untuk menaruhnya pada googledrive, tetapi jika sobat ingin tetap menggunakan aslinya, cari skrip dibawah ini pada keseluruhan kode yang diberikan, dan ganti dengan javascript diatas:

https://googledrive.com/host/0BxB6KSTbkhgBN21qaUp4RkIyWHc

Penulis juga sudah mencoba untuk memfilter hasil yang dikeluarkan dengan merubah max-results=500 menjadi 100, tetapi sepertinya default yang digunakan memang sebanyak 500 artikel, selain itu juga ketika sobat arahkan (hover) ke judul tulisan akan muncul tooltip yang berisi deskripsi, nah jika sobat tidak menginginkan hal tersebut, gunakan javascript dibawah ini:

http://mattmorzcodes.googlecode.com/files/archivenullhead.js

Demikianlah tulisan mengenai bagaimana membuat halaman arsip statis pada Blogger untuk menampilkan arsip artikel yang ada, terima kasih atas kunjungannya.

Referensi : http://www.edselmatt.com/2012/04/better-archive-page-for-blogger.html