Membuat halaman arsip di Blogger

Panduan membuat halaman arsip alias daftar isi alias sitemap sederhana di Blogger.

Layout blog ini hanya terdiri dari satu kolom, sehingga relatif sulit untuk menjelajah tulisan-tulisan lainnya karena navigasi yang tersedia hanya “postingan lama” dan “postingan lebih baru”.

Kalau layoutnya dua kolom atau lebih, akan lebih mudah menjelajah tulisan lain melalui widget “Archive” atau “Popular Posts” yang dipasang di sidebar. Meskipun kalau diakses melalui mobile akan menjadi sama saja, karena umumnya layout akan menjadi satu kolom apabila tampilannya responsive.

Makanya saya berinisiatif untuk membuatkan satu halaman khusus untuk menjelajahi tulisan-tulisan di blog ini. Jadi halaman ini khusus berisi daftar seluruh tulisan yang sudah terbit di blog ini.

Membuat halaman arsip di Blogger


Berikut langkah-langkah membuat halaman arsip di Blogger:

1. Membuat halaman statis baru melalui dasbor Blogger › Pages, klik tombol + NEW PAGE untuk menciptakan halaman baru.

2. Memberi judul misalnya “Arsip”, atau “Daftar Isi”, atau “Sitemap”, bebas terserah Anda.

3. Menyalin script di bawah ini, kemudian meletakkannya di badan pos melalui mode HTML view.

<script type="text/javascript">
  function LoadTheArchive(TotalFeed) {
    var PostTitles = new Array();
    var PostURLs = new Array();
    var PostYears = new Array();
    var PostMonths = new Array();
    var PostDays = new Array();
    if("entry" in TotalFeed.feed) {
      var PostEntries = TotalFeed.feed.entry.length;
      for(var PostNum = 0; PostNum < PostEntries; PostNum++) {
        var ThisPost = TotalFeed.feed.entry[PostNum];
  	PostTitles.push(ThisPost.title.$t);
  	PostYears.push(ThisPost.published.$t.substring(0,4));
  	PostMonths.push(ThisPost.published.$t.substring(5,7));
  	PostDays.push(ThisPost.published.$t.substring(8,10));
  	var ThisPostURL;
  	for(var LinkNum = 0; LinkNum < ThisPost.link.length; LinkNum++) {
          if(ThisPost.link[LinkNum].rel == "alternate") {
            ThisPostURL = ThisPost.link[LinkNum].href;
            break
          }
        }
        PostURLs.push(ThisPostURL);
      }
    }
    DisplaytheTOC(PostTitles,PostURLs,PostYears,PostMonths,PostDays);
  }

  function DisplaytheTOC(PostTitles,PostURLs,PostYears,PostMonths,PostDays) {
    var MonthNames = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"];
    var NumberOfEntries = PostTitles.length;
    document.write('<ul>');
    for(var EntryNum = 0; EntryNum < NumberOfEntries; EntryNum++) {
      NameOfMonth = MonthNames[parseInt(PostMonths[EntryNum],10)-1]
      document.write('<li><a href ="'+PostURLs[EntryNum]+'">'+PostTitles[EntryNum]+"</a> <small>("+parseInt(PostDays[EntryNum],10)+" "+NameOfMonth+" "+PostYears[EntryNum]+")</small></li>");
    }
    document.write('</ul>');
  }
</script>
<script src="/feeds/posts/summary?alt=json-in-script&max-results=150&start-index=1&callback=LoadTheArchive" type="text/javascript"></script>

Script tersebut akan menciptakan daftar judul tulisan yang sudah terbit di blog, dengan markup seperti ini:

<ul>
  <li><a>Judul Pos Satu</a> <small>(tanggal terbit)</small></li>
  <li><a>Judul Pos Dua</a> <small>(tanggal terbit)</small></li>
  dan seterusnya...
</ul>

4. Memodifikasi halaman, misalnya menambahkan paragraf pembuka, menambahkan gambar, dan lain-lain, karena script tersebut hanya menciptakan unordered list.

Membuat halaman arsip di Blogger.

5. Mempublikasikan halaman dengan mengeklik tombol Publish.

Anda bisa melihat halaman arsip blog saya sebagai contoh. Saya hanya menambahkan paragraf sebelum arsip tulisan, sederhana saja.

Script asli diciptakan oleh kak Wilson. Saya hanya memodifikasi sedikit, mengubah nama bulan menjadi berbahasa Indonesia, mengubah output markupnya menjadi unordered list, dan merapikannya.

Bagaimana kalau postingan ada lebih dari 150?


Script di atas hanya memuat 150 pos terbaru karena memang limitasi feed Blogger sekarang hanya dibatasi 150 pos. 

Kalau Anda punya blog dengan tulisan lebih dari 150, katakanlah lebih dari 150 namun masih kurang dari 450, Anda bisa meletakkan script ini di bawah kode di atas:

<script src="/feeds/posts/summary?alt=json-in-script&max-results=150&start-index=1&callback=LoadTheArchive" type="text/javascript"></script>
<script src="/feeds/posts/summary?alt=json-in-script&max-results=150&start-index=151&callback=LoadTheArchive" type="text/javascript"></script>
<script src="/feeds/posts/summary?alt=json-in-script&max-results=150&start-index=301&callback=LoadTheArchive" type="text/javascript"></script>

dan seterusnya.
Bagikan ke dan

Komentar