Jika Anda menerbitkan konten panjang, menambahkan daftar isi membantu mesin telusur dan pengunjung manusia untuk menavigasi dan memahami konten Anda.

Dengan widget Widget Daftar Isi untuk WordPress, Anda dapat dengan mudah menambahkan daftar isi ke situs web yang secara otomatis menghasilkan kontennya berdasarkan hierarki tag judul di konten Anda.

Sebagai contoh:

Bagaimana menambahkan isi tabel wordpress elementor tag blogpascher

Jika Anda menggunakan widget ini dengan pembuat tema visual dari Elementor Pro, Anda dapat secara otomatis menambahkan daftar isi ke semua konten Anda tanpa mengangkat jari. Ketika pengunjung mengklik link di daftar isi, itu bertindak sebagai jangkar dan membawa mereka ke bagian halaman tersebut.

Dalam posting ini, kami akan menunjukkan kepada Anda bagaimana cara mengkonfigurasi widget Widget Daftar Isi untuk WordPress dengan Elementor Pembuat Tema.

Tapi sebelumnya, mari kita temukan bersama Bagaimana menginstal sebuah blog WordPress langkah 7 et Bagaimana menemukan, menginstal dan mengaktifkan tema WordPress di blog Anda.

Lalu, kembali ke alasan kita ada di sini.

Bagaimana cara menambahkan daftar isi dengan Elementor

Pertama-tama, kami harus mencatat bahwa Anda juga dapat menggunakan widget ini dengan cara dasar. Namun, dalam tutorial ini kami fokus pada penambahan daftar isi secara otomatis ke seluruh (atau sebagian) konten Anda menggunakan Elementor Pembuat Tema dan templat posting unik.

Inilah cara melakukannya.

1. Buat atau modifikasi template posting tunggal

Untuk memulai, gunakan Pembuat Tema Elementor untuk membuat templat postingan unik baru atau edit salah satu templat postingan unik yang ada di mana Anda ingin menambahkan daftar isi.

Anda dapat menerapkan template Anda ke semua jenis posting (blog, halaman, jenis posting kustom), tetapi kami akan fokus pada posting blog.

2. Tambahkan widget Daftar Isi

Setelah Anda membuka template posting unik Anda, tambahkan widget Daftar Isi tempat Anda ingin daftar isi Anda muncul. Itu terletak di kategori Unik, dengan widget untuk judul posting dan konten posting:

Cara menambahkan isi tabel wordpress elementor blogpascher 1

Setelah Anda menambahkan widget, Anda akan secara otomatis melihat daftar semua judul yang ada di posting.

Sekarang saatnya mengkonfigurasi pengaturan widget ini.

3. Konfigurasi tabel widget

Pastikan untuk membuka pengaturan untuk widget Table Of Content. Kemudian gunakan tab Konten untuk mengonfigurasi konten yang muncul di daftar isi Anda.

Pertama, tambahkan judul - misalnya, "Daftar Isi". Ini adalah teks statis yang muncul di atas daftar tautan tautan yang dibuat widget secara otomatis.

Kemudian pilih konten untuk disertakan. Di tab Sertakan, Anda bisa masuk:

  • Tag HTML. Misalnya, Anda bisa memasukkan dan, tapi tidak kurang dari itu. Anda perlu menentukan tag judul Anda di editor WordPress.
  • Wadah. Anda juga dapat menambahkan tautan jangkar ke wadah lain di luar konten posting Anda. Misalnya, jari kaki Anda. Ini adalah fitur lanjutan.

Cara menambahkan isi tabel wordpress elementor blogpascher 2

Jika Anda mengakses tab Mengecualikan, Anda dapat mengecualikan header tertentu dari postingan Anda menggunakan pemilih CSS. Misalnya, jika Anda ingin mengecualikan satu judul , Anda dapat menambahkan kelas CSS khusus " mengabaikan Ke tajuk itu menggunakan editor WordPress, lalu kecualikan menggunakan aturan  Jangkar oleh Selector :

Cara menambahkan isi tabel wordpress elementor blogpascher 3

Kemudian Anda dapat menggunakan parameter Tampilan Penanda untuk memilih antara angka dan poin dalam daftar daftar isi Anda. Jika Anda memilih " peluru ", Anda dapat memilih dari ikon Font Awesome mana saja.

Terakhir, Anda dapat menggunakan bagian tersebut Opsi tambahan untuk mengontrol parameter lain:

kata Wrap - apakah elemen dapat mengambil beberapa baris atau tidak.

Minimalkan Kotak - jika pengunjung mungkin atau mungkin tidak mengurangi daftar isi. Jika Anda mengaktifkan opsi ini, Anda juga dapat memilih ikon khusus dan mengatur perilaku responsif. Misalnya, Anda dapat menciutkan daftar isi ini secara otomatis pengunjung di ponsel.

Tampilan Hirarkis - jika diaktifkan, subpos akan diindentasi di bawah judul induk. Jika dinonaktifkan, semuanya ditampilkan dalam satu daftar tanpa indentasi.

Cara menambahkan isi tabel wordpress elementor blogpascher 4

4. Konfigurasi pengaturan gaya

Selanjutnya, navigasikan ke tab Style untuk mengonfigurasi desain daftar isi Anda. Anda dapat mengubah semua warna dan tipografi untuk menciptakan pengalaman yang ramah pengguna dan cocok dengan sisa desain Anda. situs web :

Cara menambahkan isi tabel wordpress elementor blogpascher 5

5. Konfigurasi pengaturan lanjutan

Untuk menyelesaikan semuanya, buka tab Mahir untuk mengkonfigurasi beberapa pengaturan lagi tentang cara kerja daftar isi Anda.

Misalnya, jika Anda mengatur Lebar  sama dengan Kustom et Posisi sama dengan Tetap di bagian positioning, Anda dapat memastikan bahwa daftar isi tetap pada posisi yang sama bahkan ketika pengguna mulai menggulir halaman.

Jika Anda menggunakan positioning untuk menampilkan daftar isi Anda di atas elemen lain (seperti tajuk Anda), Anda juga dapat meningkatkan indeks Z agar muncul di atas:

Cara menambahkan isi tabel wordpress elementor blogpascher 6

Dan itu saja! Anda baru saja mempelajari cara menambahkan daftar isi ke konten Anda secara otomatis menggunakan widget Elementor Visual Theme Builder dan Daftar Isi.

Untuk memulai, beli Elementor Pro hari ini dan buat daftar isi Anda di Pembuat Tema Elementor.