1. Beranda
  2. Blogger Tips
  3. Google Apps Script

Cara Membuat Sitemap di Blogger yang Bisa Di-Index Google

18 Mei 2026

Udah capek bikin sitemap tapi isinya cuma "Memuat daftar isi..." pas dicek di Google? Tenang, masalahnya sering terjadi. Di sini bakal dibahas kenapa sitemap JS itu tidak terbaca crawler dan gimana solusinya pakai Google Apps Script.

Kenapa Sitemap JS Tidak Ter-Index Google?

Banyak template Blogger pakai script seperti ini:

<div id="sitemap-container">Memuat daftar isi...</div>

<script>
function loadSitemap(json) {
  // generate HTML dari feed
}
</script>
<script src="/feeds/posts/default?alt=json-in-script&callback=loadSitemap"></script>

Masalahnya? Googlebot tidak mengeksekusi JavaScript untuk indexing konten. Yang dilihat Google cuma teks "Memuat daftar isi..." — sisanya kosong.

Perbedaan dasarnya:

Client-side JS (tidak terindex)
  ↳ Browser eksekusi JS → render HTML
  ↳ Googlebot skip → lihat konten awal saja

Server-side / HTML Statis (terindex)
  ↳ HTML sudah lengkap saat halaman dimuat
  ↳ Googlebot langsung baca semua link

Solusi: Google Apps Script (GAS)

GAS itu server milik Google. Script dijalankan di server, hasilnya HTML murni yang dikirim ke browser. Googlebot bisa baca langsung tanpa eksekusi JS.

Langkah 1: Buat Project GAS

Buka script.google.com, klik New Project, hapus kode default.

Langkah 2: Paste Script

function generateBloggerSitemap() {
  var blogUrl = "https://ruangdebug.blogspot.com";
  var feedUrl = blogUrl + "/feeds/posts/default?alt=json&max-results=500";
  
  try {
    var response = UrlFetchApp.fetch(feedUrl);
    var json = JSON.parse(response.getContentText());
    var entries = json.feed.entry || [];
    
    var postByLabel = {};
    var labels = [];
    
    for (var i = 0; i < entries.length; i++) {
      var entry = entries[i];
      var title = entry.title.$t;
      var url = "";
      var date = entry.published.$t.substring(0, 10);
      
      for (var k = 0; k < entry.link.length; k++) {
        if (entry.link[k].rel == 'alternate') {
          url = entry.link[k].href;
          break;
        }
      }
      
      if (entry.category) {
        for (var j = 0; j < entry.category.length; j++) {
          var labelName = entry.category[j].term;
          if (!postByLabel[labelName]) {
            postByLabel[labelName] = [];
            labels.push(labelName);
          }
          postByLabel[labelName].push({
            title: title,
            url: url,
            date: date
          });
        }
      }
    }
    
    labels.sort();
    
    var html = '<style>';
    html += '#sitemap-container{font-family:"Bai Jamjuree",sans-serif;color:#16213e;}';
    html += '.sitemap-label{display:block;font-size:1.1rem;font-weight:700;margin:25px 0 15px;padding-bottom:5px;border-bottom:1px solid #0f3460;color:#e94560;text-transform:capitalize;}';
    html += '.sitemap-list{list-style:none;padding:0;margin:0;}';
    html += '.sitemap-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(204,204,204,0.1);font-size:0.95rem;transition:all 0.3s ease;}';
    html += '.sitemap-item:hover{padding-left:5px;background:rgba(233,69,96,0.05);}';
    html += '.sitemap-item a{text-decoration:none;color:#1a1a2e;}';
    html += '.sitemap-item a:hover{color:#e94560;}';
    html += '.sitemap-date{font-size:0.8rem;color:#0f3460;white-space:nowrap;margin-left:15px;}';
    html += '@media(max-width:600px){.sitemap-item{flex-direction:column;}.sitemap-date{margin-left:0;margin-top:5px;}}';
    html += '</style>';
    html += '<div id="sitemap-container">';
    
    for (var i = 0; i < labels.length; i++) {
      var label = labels[i];
      html += '<div class="sitemap-label">' + label + '</div>';
      html += '<ul class="sitemap-list">';
      
      var posts = postByLabel[label];
      for (var j = 0; j < posts.length; j++) {
        html += '<li class="sitemap-item">';
        html += '<a href="' + posts[j].url + '">' + posts[j].title + '</a>';
        html += '<span class="sitemap-date">' + posts[j].date + '</span>';
        html += '</li>';
      }
      
      html += '</ul>';
    }
    
    html += '</div>';
    
    var ss = SpreadsheetApp.create('Sitemap Ruang Debug - ' + new Date().toLocaleDateString());
    var sheet = ss.getActiveSheet();
    sheet.getRange("A1").setValue(html);
    sheet.autoResizeColumn(1);
    
    Logger.log("Spreadsheet: " + ss.getUrl());
    
  } catch (error) {
    Logger.log("Error: " + error.toString());
  }
}

Ganti https://ruangdebug.blogspot.com dengan URL blog sendiri.

Langkah 3: Jalankan Script

Klik tombol Run (▶️), izinkan permission kalau diminta. Cek Execution log untuk lihat hasil.

Langkah 4: Ambil Hasil HTML

Buka link spreadsheet yang muncul di log, copy isi sel A1. Itu adalah HTML lengkap siap pakai.

Cara Pasang di Blogger

Buat Halaman Statis

Di dashboard Blogger, masuk Pages → New Page. Ubah ke mode HTML (bukan Compose).

Paste HTML + Tambah Intro SEO

<h1>Daftar Isi Ruang Debug</h1>

<p>Selamat datang di daftar isi lengkap blog Ruang Debug. Temukan tutorial programming, tips Blogger, dan trik SEO yang telah dipublikasikan sejak 2020.</p>

<p>Semua artikel dikelompokkan berdasarkan kategori untuk memudahkan navigasi.</p>

<!-- PASTE HTML DARI SPREADSHEET DI SINI -->

<hr>

<p><strong>Tips:</strong> Gunakan fitur pencarian di blog untuk menemukan artikel spesifik.</p>

Publish dengan slug /p/sitemap.html atau /p/daftar-isi.html.

Kenapa Sitemap HTML Itu SEO-Friendly?

Internal Linking Kuat

Setiap artikel mendapat backlink internal dari halaman sitemap. Googlebot lebih mudah menemukan dan crawl artikel lama yang sudah tidak muncul di homepage.

Anchor Text Relevan

Link menggunakan judul artikel sebagai anchor text, bukan teks generik seperti "Read more". Ini memberi sinyal relevansi keyword ke Google.

<!-- Bagus -->
<a href="/2026/01/tutorial-react.html">Tutorial React Lengkap untuk Pemula</a>

<!-- Kurang bagus -->
<a href="/2026/01/tutorial-react.html">Baca selengkapnya</a>

Struktur Semantik HTML

Pakai tag <ul>, <li>, <a> yang Google pahami sebagai navigasi situs. Bukan konten duplikat.

Perbandingan Sitemap HTML vs XML

Fitur Sitemap HTML XML Sitemap
Untuk siapa Pengunjung manusia Googlebot crawler
Bisa dibaca Ya, manusia Tidak, kode XML
Di-index Google Bisa, jika HTML statis Wajib submit ke GSC
Link juice Ya, internal link aktif Tidak, hanya daftar URL
Tujuan utama Navigasi user + SEO bonus Indexing teknis

Keduanya berbeda dan saling melengkapi. XML untuk Google Search Console, HTML untuk pengunjung dan bonus internal linking.

Auto-Update dengan Trigger GAS

Biar tidak perlu run manual tiap kali publish artikel baru, tambahkan trigger otomatis:

function setupTrigger() {
  var triggers = ScriptApp.getProjectTriggers();
  triggers.forEach(function(t) {
    if (t.getHandlerFunction() === 'generateBloggerSitemap') {
      ScriptApp.deleteTrigger(t);
    }
  });
  
  ScriptApp.newTrigger('generateBloggerSitemap')
    .timeBased()
    .everyDays(1)
    .atHour(8)
    .create();
    
  Logger.log("Trigger harian jam 08:00 aktif!");
}

Run setupTrigger() sekali. Script akan otomatis generate spreadsheet baru setiap pagi. Tinggal copy-paste ke Blogger sesuai jadwal publish masing-masing.

Checklist SEO Sitemap

  • HTML statis, bukan JS-generated
  • Grouping by label / kategori
  • Anchor text pakai judul artikel asli
  • Tambah intro 1-2 paragraf
  • Meta robots index, follow
  • Submit XML sitemap ke Google Search Console
  • Update berkala (bulanan atau per 50 artikel baru)

Kesimpulan

Sitemap HTML yang benar itu bukan duplikat konten, melainkan navigasi internal yang membantu Googlebot menemukan semua artikel. Asal pakai HTML statis dan struktur semantik yang benar, halaman sitemap justru jadi aset SEO.

GAS jadi solusi praktis karena bisa fetch feed Blogger, proses data, dan keluarkan HTML siap pakai — semua di server Google, bukan di browser pengunjung.

Selamat mencoba.

Aurealisa ID
Fakta Gambar (Science Fact), Kutipan (Quote Of The Day), Ulasan (Science Review), Tips, Artikel.
Profil

Komentar