Pada tutorial sebelumnya, Anda tentunya sudah tau bagaimana membuat daftar isi dengan menggunakan Kadence Blocks. Hanya dengan beberapa langkah mudah Anda sudah bisa menampilkan daftar isi dengan tampilan yang menarik.
Jika Ada menggunakan tema Kadence dan plugin Kadence Pro Anda bisa memanfaatkan Kadence Element Hooks untuk menampilkan daftar isi di sidebar WordPress.
Jika Anda melihat tutorial ini menggunakan PC desktop maka Anda akan melihat daftar isi di sidebar. Yup, Anda juga bisa memilih target pengguna yang bisa melihat daftar isi yang ada di sidebar WordPress.
Persiapan
Ada dua plugin yang harus diinstall jika Anda ingin menampilkan daftar isi di sidebar WordPress, yaitu Kadence Blocks dan Kadence Pro.
1. Install Kadence Blocks
Kadence Blocks adalah plugin yang memberikan banyak fitur baru pada editor Gutenberg di WordPress. Salah satu fitur yang ada di Kadence Blocks adalah Table of Contents atau Daftar Isi.
Sama seperti cara menginstal semua plugin yang ada di direktori plugin WordPress, Anda perlu login ke dashboard untuk menginstal plugin ini.
- Dari dashboard klik App Plugins kemudian klik Add New.
- Ketik Kadence Blocks di kolom pencarian.
- Klik Install Now kemudian klik Activate.
Kami memiliki tutorial lengkap cara menginstall plugin jika Anda ingin mengetahui langkah detail dalam menginstall plugin.
2. Install Kadence Pro
Kadence Pro adalah addon untuk Kadence Theme dan merupakan plugin berbayar. Plugin ini diperlukan karena Anda harus menggunakan Kadence Element Hooks. Plugin ini adalah.
Setelah Anda membeli dan mendapatkan file installer plugin dalam format zip, Anda bisa langsung menginstallnya.
Karena plugin ini tidak ada di plugin direktori WordPress maka Anda harus upload plugin tersebut secara manual. Tapi tenang saja, caranya cukup mudah kok.
- Login dengan menggunakan alamat www.domain-anda.com/wp-admin atau www.domain-anda.com/wp-login.php.
- Upload file zip yang Anda download dari menu Plugins.
- Install dan aktifkan Kadence Pro.
Lihat panduan cara menginstall plugin jika Anda ingin mengetahui langkah detail dalam menginstall plugin.
3. Aktifkan Kadence Elements
Setelah Kadence Pro aktif, klik menu Appearance > Kadence. Di halaman ini Anda akan melihat semua addon pro. Pastikan tombol pada bagian Hooked Elements berwarna biru. Jika tidak berwarna biru klik pada tombol tersebut untuk membuat fitur tersebut aktif.
Ayo Bikin Website juga mempunyai panduan yang lebih lengkap jika Anda ingin tau lebih tentang apa itu Kadence Elements dan cara menggunakannya.
Menampilkan Daftar Isi di Sidebar
Untuk menampilkan daftar isi di sidebar tidak terlalu sulit. Hanya diperlukan beberapa langkah untuk melakukannya.
1. Buat Element Baru
Masuk ke halaman Kadence Elements dengan klik pada menu Appearance > Kadence > Elements yang ada pada bagian sidebar WordPress dashboard.
Buat element baru dengan klik pada tombol Add New.
Pilih tipe element Default.
2. Masukkan Daftar Isi ke Element
Klik tombol + yang ada di pojok kiri atas kemudian cari block Table of Contents.
Atur tampilan daftar isi sesuai dengan yang Anda inginkan. Anda bisa membaca panduan kami tentang cara mengatur tampilan daftar isi jika ingin tau lebih dalam tentang hal ini.
Ya, yang perlu Anda lakukan hanya mengatur seperti apa nantinya daftar isi yang ingin Anda tampilkan di sidebar. Sedangkan isinya biarkan kosong.
3. Tampilkan Element di Sidebar
Setelah pengaturan tampilan yang Anda buat jadi, sekarang saatnya Anda melakukan pengaturan untuk menampilkan daftar isi di sidebar.
Caranya adalah dengan klik tombol Element Settings yang ada di bagian pojok kanan atas halaman seperti terlihat pada gambar di atas. Setelah Anda klik akan muncul berbagai pengaturan yang bisa Anda lakukan. Yang perlu Anda pilih adalah pengaturan penempatan element atau Placement Settings.
Untuk melihat penempatan posisi Anda bisa klik dropdown placement settings berikut:
Anda mempunyai tiga opsi pilihan untuk menampilkan daftar isi di sidebar, yaitu before sidebar, replace sidebar, dan after sidebar. Jika Anda masih ingin widget lain di sidebar tampil maka pilih opsi before sidebar atau after sidebar.
4. Pengaturan Tambahan
Ada beberapa pengaturan lain yang bisa dipakai.
- Device Settings.
Contohnya pada halaman ini, daftar isi di sidebar hanya akan tampil saat pengunjung mengakses halaman ini menggunakan PC. Jika ditampilkan juga pada pengunjung smartphone akan menjadi sia-sia karena daftar isi akan berada di bawah konten. - Display Settings.
Anda tentunya hanya ingin daftar isi tampil di postingan saja, tidak di seluruh halaman website. Anda bisa mengaturnya melalui display settings. Contohnya pada gambar di atas, pengaturan pada display setting akan membuat daftar isi hanya tampil pada semua postingan.
Setelah selesai semua pengaturan, saatnya Anda publish element yang Anda buat dan lihat hasilnya. Mulai sekarang setiap Anda membuat artikel maka secara otomatis daftar isi akan tampil di sidebar seperti pada gambar ini.
Kesimpulan
Sangat mudah diaplikasikan bukan?
Dengan hanya menggunakan Kadence Element Hooks ada cukup sekali membuat template dan secara otomatis Kadence akan menampilkan daftar isi di sidebar WordPress.
Jika Anda ingin request tutorial yang lain silahkan request di kolom komentar.
