Hostnic Promo

Cara Membuat Daftar Isi di Blogger: Buat Tabel Isi di Blogger untuk Navigasi yang Mudah!

Cara Membuat Daftar Isi di Blogger: Buat Tabel Isi di Blogger untuk Navigasi yang Mudah!
Cara Membuat Daftar Isi di Blogger: Buat Tabel Isi di Blogger untuk Navigasi yang Mudah!

 

Sahabat Hostnic!  Apa kabar? Semoga sehat selalu. Pada kesempatan kali ini, kita akan membahas cara membuat daftar isi di Blogger. Daftar isi atau tabel isi sangat penting dalam sebuah blog karena memudahkan pembaca untuk menavigasi konten dengan mudah. Dalam artikel ini, kita akan membahas langkah-langkah membuat daftar isi di Blogger yang dapat meningkatkan pengalaman pembaca. Yuk, simak pembahasan lengkapnya!

1. Mengatur Heading dan Subheading

Langkah pertama dalam membuat daftar isi di Blogger adalah dengan mengatur heading dan subheading. Gunakan tag <h2> untuk subjudul dan <h3> untuk judul kesimpulan. Heading dan subheading ini akan menjadi bagian dari daftar isi.

2. Membuat Daftar Isi Manual

Jika Anda ingin membuat daftar isi secara manual, berikut adalah langkah-langkahnya:

  1. Tambahkan tag <a name=”judul”> sebelum setiap heading atau subheading yang ingin ditambahkan ke daftar isi. Gantilah “judul” dengan teks yang relevan.
  2. Tambahkan tautan ke daftar isi dengan menggunakan tag <a href=”#judul”>. Gantilah “judul” dengan teks yang relevan dan sesuaikan dengan URL halaman Anda.

Ulangi langkah ini untuk setiap heading atau subheading yang ingin Anda sertakan dalam daftar isi.

3. Membuat Daftar Isi Otomatis dengan JavaScript

Jika Anda ingin membuat daftar isi secara otomatis, Anda dapat menggunakan JavaScript. Berikut adalah langkah-langkahnya:

  1. Tambahkan tag <div id=”daftar-isi”></div> di tempat Anda ingin menampilkan daftar isi.
  2. Tambahkan kode JavaScript berikut di bawah tag <div id=”daftar-isi”></div>:

<script>

var isi = document.getElementById(“daftar-isi”);

var headings = document.querySelectorAll(“h2, h3”);

var list = “<ol>”;

for (var i = 0; i < headings.length; i++) {

var heading = headings[i];

var link = “<a href=’#” + heading.id + “‘>” + heading.textContent + “</a>”;

if (heading.tagName === “H2”) {

list += “<li>” + link + “<ol>”;

} else {

list += “<li>” + link + “</li>”;

if (i === headings.length – 1 || headings[i + 1].tagName === “H2”) {

list += “</ol></li>”;

}

}

}

isi.innerHTML = list + “</ol>”;

</script>

Setelah Anda menambahkan kode JavaScript di atas, daftar isi akan secara otomatis ditampilkan dalam tag <div id=”daftar-isi”></div> sesuai dengan heading dan subheading yang Anda tentukan.

4. Menambahkan Daftar Isi ke Halaman Blog

Setelah Anda berhasil membuat daftar isi menggunakan metode manual atau JavaScript, langkah berikutnya adalah menambahkannya ke halaman blog di platform Blogger. Berikut adalah cara menambahkan daftar isi secara otomatis menggunakan JavaScript di platform Blogger:

  1. Buka dashboard Blogger dan pilih blog yang ingin Anda edit.
  2. Pilih “Tata Letak” dari menu samping.
  3. Pilih “Tambahkan Gadget” di area di mana Anda ingin menampilkan daftar isi.
  4. Pilih gadget “HTML/JavaScript”.
  5. Di dalam gadget “HTML/JavaScript”, beri judul pada gadget, misalnya “Daftar Isi”.
  6. Salin dan tempelkan kode JavaScript yang Anda gunakan untuk membuat daftar isi di dalam kotak konten gadget.
  7. Klik “Simpan” atau “Terapkan” untuk menyimpan perubahan.
  8. Periksa tampilan blog Anda untuk memastikan daftar isi ditampilkan dengan benar.

Dengan langkah-langkah di atas, daftar isi akan otomatis ditampilkan di halaman blog Anda di platform Blogger.

Keuntungan Menggunakan Daftar Isi di dalam Sebuah Blog

Terdapat beberapa keuntungan penting dalam menggunakan daftar isi di dalam sebuah blog:

  1. Mempermudah Navigasi: Daftar isi membantu pembaca untuk menemukan dan mengakses konten yang mereka cari dengan cepat dan mudah. Hal ini meningkatkan pengalaman pembaca dan memudahkan mereka untuk menjelajahi blog Anda.
  2. Peningkatan SEO: Menggunakan daftar isi dapat membantu mesin pencari seperti Google memahami struktur konten blog Anda. Ini dapat meningkatkan peluang peringkat lebih tinggi dalam hasil pencarian dan meningkatkan visibilitas blog Anda.
  3. Organisasi Konten: Dengan daftar isi, pembaca dapat melihat secara keseluruhan topik-topik yang dibahas dalam blog Anda. Ini membantu dalam memahami struktur konten dan membantu pembaca untuk melihat gambaran umum sebelum memilih konten yang ingin mereka baca.
  4. Meningkatkan Engagement: Dengan mempermudah navigasi dan memberikan gambaran konten yang tersedia, daftar isi dapat meningkatkan tingkat keterlibatan pembaca. Pembaca yang menemukan konten yang relevan dengan cepat cenderung lebih lama tinggal di blog Anda dan menjelajahi lebih banyak konten.

Metode Lain untuk Membuat Daftar Isi di Blogger

Selain menggunakan JavaScript, terdapat juga metode lain untuk membuat daftar isi di platform Blogger:

  1. Plugins dan Widget: Anda dapat menggunakan plugins dan widget yang tersedia di Blogger untuk membuat daftar isi dengan mudah. Ada berbagai pilihan plugins dan widget yang dapat Anda tambahkan ke blog Anda untuk menghasilkan daftar isi yang menarik dan berfungsi.
  2. Manual dengan Hyperlink: Anda dapat membuat daftar isi secara manual dengan menambahkan hyperlink ke setiap heading atau subheading di blog Anda. Caranya adalah dengan menautkan teks daftar isi ke bagian yang relevan di dalam blog Anda.
  3. Template Khusus: Beberapa template Blogger memiliki fitur bawaan untuk daftar isi. Anda dapat memilih template yang mendukung daftar isi dan mengaktifkannya melalui pengaturan template.

Plugin atau Widget untuk Membuat Daftar Isi di Blogger

Ada beberapa plugin dan widget yang dapat Anda gunakan untuk membuat daftar isi di platform Blogger. Berikut adalah beberapa rekomendasi:

1. Table of Contents Plus: Plugin ini memungkinkan Anda untuk dengan mudah menambahkan daftar isi ke blog Anda. Anda dapat menyesuaikan tampilan dan gaya daftar isi sesuai keinginan Anda. Plugin ini juga mendukung pembuatan daftar isi berdasarkan label atau kategori tertentu. Anda dapat mencari dan menginstal plugin ini melalui menu “Tata Letak” di dashboard Blogger.

2. Easy Table of Contents: Plugin ini juga merupakan pilihan populer untuk membuat daftar isi di Blogger. Plugin ini menawarkan berbagai opsi penyesuaian dan memungkinkan Anda untuk menambahkan daftar isi secara otomatis ke postingan blog Anda. Anda dapat mencari dan menginstal plugin ini melalui menu “Tata Letak” di dashboard Blogger.

Pastikan untuk membaca ulasan dan dokumentasi plugin sebelum menginstalnya untuk memastikan sesuai dengan kebutuhan dan kompatibilitas dengan versi Blogger yang Anda gunakan. Selain itu, ada juga widget daftar isi yang tersedia di luar Blogger yang dapat Anda cari dan gunakan dengan cara yang serupa.

Menambahkan Hyperlink ke Setiap Heading atau Subheading di Blog Menggunakan Blogger

Untuk menambahkan hyperlink ke setiap heading atau subheading di blog menggunakan Blogger, ikuti langkah-langkah berikut:

1. Buka editor postingan atau halaman di Blogger.
2. Sorot teks heading atau subheading yang ingin Anda jadikan hyperlink.
3. Pilih ikon tautan (berbentuk ikatan rantai) di toolbar editor atau gunakan pintasan keyboard Ctrl + K (untuk Windows) atau Command + K (untuk Mac).
4. Dalam dialog tautan, masukkan URL atau alamat halaman tujuan yang ingin ditautkan oleh heading atau subheading.
5. Klik “Oke” atau “Tambahkan Tautan” untuk menyimpan tautan.
6. Ulangi langkah-langkah di atas untuk setiap heading atau subheading yang ingin Anda jadikan hyperlink.

Setelah Anda menyimpan perubahan, heading atau subheading akan menjadi hyperlink yang mengarah ke halaman yang ditentukan.

Template Blogger dengan Fitur Bawaan untuk Daftar Isi

Beberapa template Blogger memiliki fitur bawaan untuk daftar isi. Berikut adalah beberapa template yang populer dengan fitur tersebut:

1. Contempo: Template ini memiliki widget “Daftar Isi” yang dapat ditambahkan ke tata letak blog. Anda dapat mengaktifkannya melalui menu “Tata Letak” di dashboard Blogger.

2. Emporio: Template ini juga dilengkapi dengan widget “Daftar Isi” yang dapat ditambahkan ke tata letak blog. Anda dapat mengaksesnya melalui menu “Tata Letak” di dashboard Blogger.

3. Notable: Template ini memiliki fitur bawaan untuk daftar isi yang dapat diaktifkan melalui pengaturan template. Anda dapat mengklik “Edit HTML” di dashboard Blogger dan mencari kode yang mengontrol fitur daftar isi untuk mengaktifkannya.

Pastikan untuk memeriksa dokumentasi template yang Anda gunakan untuk mengetahui apakah template tersebut memiliki fitur bawaan untuk daftar isi dan bagaimana mengaktifkannya.

Sekian informasi mengenai plugin, widget, hyperlink, dan template Blogger untuk membuat daftar isi. Semoga membantu!

 

Sampai jumpa kembali di artikel menarik lainnya!

Artikel Lainnya:


Di tulis oleh: