Cara Membuat Daftar Isi Konten Website yang Keren

Apakah Anda sudah tahu cara membuat daftar isi di konten / artikel website? Bila belum tahu, Anda sudah ada di tempat yang tepat. Artikel ini akan membahas dua cara membuat daftar isi konten website yang keren dan dapat Anda praktikkan sendiri. Simak selengkapnya!

Membuat Daftar Isi Konten

Table of Content

Daftar isi atau table of content (TOC) merupakan elemen yang tidak boleh Anda lewatkan saat membuat konten / artikel di website. Apalagi, jika konten / artikel website Anda cukup panjang dan perlu waktu lama untuk dibaca.

Kenapa perlu membuat daftar isi konten website? Sebab daftar isi akan membantu pengunjung langsung membuka bagian artikel yang berisi jawaban yang dicari. Daftar isi juga bisa membantu mengurangi bounce rate website.

Cara Membuat Daftar Isi di Blog

Sebelum membuat daftar isi konten website, susun artikel jadi beberapa topik dan subtopik melalui pengaturan Heading. Sebagai contoh :

  • Judul dari paragraf pertama dijadikan heading 1,
  • subjudul atau penjabarannya dijadikan heading 2,
  • dan seterusnya dengan pola yang sama.

Ada dua cara membuat daftar isi WordPress, yaitu manual dan menggunakan plugin WordPress. Berikut penjelasan keduanya :

a. Membuat Daftar Isi Secara Manual

Ada dua cara untuk membuat daftar isi konten website secara manual berdasarkan editor visualnya, yaitu Gutenberg dan Classic. Sebelum membuat daftar isi secara manual Anda perlu melakukan hal-hal berikut :

  1. Masuk ke dasbor dengan mengisi username dan password WordPress Anda.
  2. Akses post yang ingin diberi daftar isi.
1) Gutenberg Editor

Di Gutenberg Editor ada 2 cara mudah untuk membuat daftar isi pada website WordPress.

Cara 1

Berikut cara pertama untuk membuat daftar isi konten website dengan Gutenberg Editor :

  1. tambah blok Heading di tiap bagian yang mau disertakan di dalam daftar isi;
  2. bila sudah, buka menu Tingkat Lanjut (Advanced) di Sidebar dan tuliskan Anchor HTML (HTML Anchor) untuk heading tersebut;
  3. ulangi langkah 2 untuk semua heading di post Anda;
  4. tambahkan block List;
  5. lalu masukkan semua judul heading secara berurutan;
  6. untuk membedakan H2 dan H3, Anda dapat memakai fitur Indent pada judul H3 (optional);
  7. block salah satu judul heading yang ada di List;
  8. kemudian, klik icon Link atau gunakan shortcut Ctrl+K;
  9. ketik tanda hashtag (#);
  10. paste HTML Anchor yang telah Anda tulis di menu Advanced sesuai dengan judul pada Heading;
  11. lalu tekan Enter;
  12. ulangi langkah-langkah di atas pada semua heading dalam daftar isi agar masing-masing punya link internal.

Cara 2

Berikut cara kedua untuk membuat daftar isi konten website dengan Gutenberg Editor :

  1. Buat heading yang akan dipakai sebagai item dalam daftar isi nantinya.
  2. Klik blok di masing-masing heading tersebut.
  3. Nantinya akan muncul toolbar.
  4. Klik More Options (icon 3 titik vertikal) pada toolbar tersebut.
  5. Pilih Edit as HTML.
  6. Tambahkan Nama ID ke tag pembuka judul. Nama ID ini merupakan sebuah identifikasi unik yang ditambahkan ke dalam tag pembuka elemen.
  7. Ulangi langkah 6 pada tiap heading yang Anda buat untuk dimasukan ke dalam daftar isi.
  8. Klik tombol Tambah Blog dengan icon plus (+).
  9. Klik blok HTML Khusus yang nantinya akan Anda pakai untuk membuat daftar isi website.
  10. Bikin jump link, dengan cara memasukkan kode di bawah ini ke dalam konten yang sebelumnya sudah Anda buat.

2) Classic Editor

Untuk membuat daftar isi konten website dengan Classic Editor, Anda bisa copy paste kode HTML di bawah :

<div class=“toc”>
<p>Table of contents</p>
<ol>
<li><a href=“#1”>Anchor 1</a></li>
<li><a href=“#2”>Anchor 2</a></li>
<li><a href=“#3”>Anchor 3</a></li>
<li><a href=“#4”>Anchor 4</a></li>
</ol>
</div>

Selanjutnya, Anda bisa memberikan kode id=“nomor”, misalnya :

  • <h2 id=“1”>Anchor 1</h2>
  • <h3 id=“2”>Anchor 2</h3>
  • <h5 id=“3”>Anchor 3</h5>
  • <p id=“4”>Anchor 4</p>

b. Membuat Daftar Isi dengan Plugin

Beberapa plugin SEO sudah menyertakan tool untuk membuat daftar isi konten di WordPress. Namun bila Anda lebih suka memakai plugin daftar isi WordPress sendiri, berikut beberapa rekomendasinya (disertai langkah pengaturannya) :

1) Easy Table of Contents

Easy Table of Contents merupakan salah satu plugin daftar isi yang paling banyak di-download. Plugin ini memudahkan pengguna membuat TOC tanpa harus mengedit kode HTML apapun.

Untuk membuat daftar isi otomatis, Anda cukup mengonfigurasi pengaturan plugin seperti yang akan dibahas di bawah.

Berikut langah membuat daftar isi konten website dengan plugin Easy Table of Contents :

  1. Instal dan aktifkan plugin.
  2. Setelah plugin aktif, buka menu Pengaturan (Settings) >> Table of Contents.
  3. Di bagian General :
  • Enable Support dan Auto Insert : pilih post dan page (atau sesuai keinginan);
  • Position : Before first heading (atau sesuai keinginan);
  • Show when : 2 (atau sesuai keinginan).
  1. Pada bagian Appearance, Anda bisa mengubah :
  • letak daftar isi,
  • font size,
  • warna,
  • lebar daftar isi,
  • dan lainnya.
  1. Di bagian Advanced Anda bisa mengatur heading mana saja yang akan Anda tampilkan di daftar isi website.
  2. Yang lain biarkan default.
  3. Jika sudah selesai melakukan seluruh konfigurasi, klik tombol Save Changes.
2) Table of Content Plus

Plugin ini bisa jadi pilihan yang tepat bila Anda punya website yang lebih kompleks dengan postingan WordPress multi-halaman. Dengan plugin Table of Contents Plus memungkinkan pengguna untuk mengindeks dan menampilkan TOC di sidebar postingan mereka.

Berikut langah membuat daftar isi konten website dengan plugin Table of Contents Plus :

  1. Instal dan aktifkan plugin.
  2. Setelah plugin aktif, buka menu Pengaturan (Settings) >> TOC+.
  3. Lalu di bagian Main Options, lakukan hal berikut :
  • Position : Top (atau sesuai keinginan);
  • Show when : 2 (atau sesuai kebutuhan);
  • Auto insert for the following content types : centang / ceklist pada post dan page (atau sesuai kebutuhan);
  • Heading text : Daftar Isi (atau sesuai keinginan);
  • Klik tombol Update Options.
  1. Yang lain biarkan default.
3) LuckyWP Table of Contents

LuckyWP kompatibel dengan sejumlah plugin page builder WordPress. Pengguna dapat menyesuaikan tampilan daftar isi dengan menyesuaikan :

  • lebar,
  • warna kursor, dan
  • ukuran font.

Bahkan, plugin ini punya opsi TOC mengambang atau floating TOC. Plugin TOC ini menyediakan :

  • fitur yang SEO Friendly, dan
  • pengalaman pengguna (UX) yang lancar. 

Berikut langah membuat daftar isi konten website dengan plugin LuckyWP Table of Contents :

  1. Instal dan aktifkan plugin.
  2. Setelah plugin aktif, buka menu Pengaturan (Settings) >> Daftar Isi (Table of Contents).
  3. Klik tab Umum (General), atur :
  • Hitungan Minimal dari Heading (Minimal Count of Headings) : 2 (atau sesuai keinginan);
  • Kedalaman (Depth) : 6 (atau sesuai keinginan);
  • Header >> Judul (Title), Anda dapat menetapkan judul Isi jadi “Daftar Isi”, “Contents” atau sesuai keinginan.
  1. Pada tab Tampilan (Appearance), Anda bisa mengubah warna.
  2. Klik tab Sisipkan (Auto Insert) dan centang Aktifkan (Enable) bila Anda menginginkan daftar isi otomatis ditambahkan di setiap artikel. Anda juga bisa memilih jenis postingan misalnya Pos dan Laman.
  3. Yang lain biarkan default.

Catatan:

  • Pastikan tiap pengaturan tab harus selalu klik simpan.
4) SimpleTOC – Table of Contents Block

Jika Anda sering memakai Gutenberg, sebaiknya pakai plugin ini untuk membuat daftar isi konten website WordPress. Plugin TOC WordPress ini menawarkan opsi gaya asli Gutenberg Editor. Yang mana pengaturan bisa  langsung dari widget sidebar. 

Salah satu keunggulan dari plugin ini yaitu punya banyak pilihan bahasa dan kompatibel dengan teks non-Latin. Seperti bahasa :

  • Arab, dan
  • Jepang.

Tentu saja ini akan memudahkan pengguna yang punya website multibahasa atau non-Inggris. Anda dapat mengintegrasikan seluruh fitur ini ke dasbor WordPress tanpa adanya biaya tambahan.

5) Ultimate Blocks

Ultimate Blocks yaitu plugin multifungsi yang menawarkan 47 jenis block untuk editor Gutenberg WordPress, termasuk block table of contents. Semua block gratis dan kompatibel dengan WordPress versi 5.0 dan yang lebih baru.

Plugin ini merupakan pilihan tepat bila Anda punya postingan website yang panjang dengan berbagai jenis konten. Misalnya, plugin ini sangat cocok untuk blogger atau marketer yang mau membuat block CTA dan testimoni selain block daftar isi.

Sampai sini, Anda sudah berhasil menyelesaikan langkah-langkah membuat daftar isi konten website keren dengan menggunakan plugin. Plugin TC ini akan membuat daftar isi secara otomatis sesudah pos diterbitkan.

Yuk Membuat Daftar Isi Konten Website Anda!

Di artikel ini, Anda telah mempelajari bagaimana cara membuat daftar isi di website WordPress. Metode mana yang mau Anda praktikkan?

Apapun metodenya, sesuaikan saja dengan kebutuhan Anda :

  • Bila tak mau memberatkan server website, maka cara manual bisa jdai pilihan.
  • Jika mau cara yang lebih praktis, maka dengan plugin bisa jadi pilihan yang tepat.

Sekian informasi perihal cara membuat daftar isi konten website yang keren, kami harap artikel ini mencerahkan sahabat semua. Kami berharap artikel tutorial WordPress ini dishare agar semakin banyak yang memperoleh manfaat.

Leave a Reply

Memperbaiki Permalink Website
Cara Memperbaiki Permalink Website yang Rusak
Reset Website WordPress
Cara Reset Website WordPress dengan Mudah
Membuat Custom Login
Cara Membuat Custom Login di Website WordPress
Cara Setting Robots TXT di Website
Bahasa Pemrograman CMS cPanel Domain Hosting Web Siap
Fitur di cPanel Hosting
Fitur di cPanel Hosting Website
Domain Tingkat Atas
Jenis Domain Tingkat Atas Terbaik yang Ada Sekarang
Keunggulan Domain Berbayar
Keunggulan Domain Berbayar bagi Bisnis yang Perlu Diketahui

Dasar SEO

Pengenalan SEO Riset Keyword

Optimasi Lanjutan

Copywriting Error Website Tips SEO

Teknik SEO

SEO Off Page SEO OnPage SEO Teknikal

Tools SEO

Tools Google Tools Riset KK Tools SEO Lain
Bisnis Jualan Link PPC Program Afiliasi Publisher Sumber Lain
Mendapatkan Uang dari Website
Cara Mendapatkan Uang dari Website yang Kita Punya
Jualan Online via Website
Jualan Online via Website yang Mudah Dilakukan
Platform SeedBacklink
Platform Seedbacklink Solusi Promosi Website dan Income Online
Plugin Toko Online Terbaik
Plugin Toko Online Terbaik Saat Ini
Theme Woocommerce Terbaik
Theme WooCommerce Terbaik untuk Toko Online
Plugin AdSense Terbaik
Plugin AdSense Terbaik untuk Memasang Iklan di Website
Theme Portofolio Terbaik
Theme Portofolio Terbaik untuk Web Agency dan Freelance