Cara Membuat Daftar Isi Artikel Otomatis Di Template VioMagz
VioMagz merupakan salah satu template blogger yang cukup populer. Template ini dikembangkan oleh Mas Sugeng, salah satu blogger legend yang sudah lama berkecimpung di dunia blog dan pembuatan template blogger.
Sekilas tentang VioMagz
Template VioMagz mulai dirilis pada tahun 2018 dan sampai kini terus diperbarui. Saat artikel ini dirilis, VioMagz terakhir diupdate pada bulan Januari 2022.
Dari segi fitur dan kelebihan, tema blogger VioMagz mengambil semua yang terbaik dari salah satu tema buatan Mas Sugeng sebelumnya bernama Evo Magz, kemudian membuatnya menjadi lebih baik lagi.
Namun template VioMagz belum punya fitur daftar isi otomatis pada artikel.
Fitur ini mirip seperti yang dimiliki oleh Wikipedia. Jadi ketika kita ingin menuju ke bahasan tertentu, kita bisa langsung mengeklik bagian tersebut di bagian daftar isi dan melewati bahasan yang tidak perlu.
Contoh fitur yang dimaksud adalah seperti berikut:
Nah, di artikel ini kita akan coba membuat daftar isi otomatis pada artikel dan menambahkan fitur ini ke template VioMagz. Simak sampai habis, ya.
Kelebihan dan Manfaat Membuat Daftar Isi pada Artikel
Fitur ini sangat membantu apabila Anda memiliki artikel yang dibagi-bagi ke dalam beberapa subjudul.
Contohnya seperti artikel yang sedang Anda baca ini. Artikel ini memiliki judul “Cara Membuat Daftar Isi Otomatis pada Artikel di Template VioMagz” dan memiliki subjudul:
* Sekilas tentang VioMagz
* Kelebihan dan Manfaat Membuat Daftar Isi pada Artikel
* Langkah-langkah Membuat Daftar Isi Artikel Otomatis di Template VioMagz
* Penutup
Kelebihan membuat artikel yang dibagi ke dalam subjudul akan memudahkan mesin pencari seperti Google untuk mengindeks isi artikel yang kita punya.
Menambahkan daftar isi pada artikel juga akan memudahkan pengunjung blog kita jika ingin berpindah-pindah pada subjudul tertentu yang dikehendaki, tanpa harus banyak scroll.
Selain itu, Google sangat menyukai blog yang punya daftar isi. Salah satu yang spesial adalah saat artikel blog kita masuk pada laman hasil pencarian, maka di bawah paragraf deskripsi akan muncul link berisi subjudul dari isi konten artikel kita. Saat diklik akan langsung dibawa menuju bagian tersebut.
Contohnya adalah seperti artikel trivusi.web.id berikut:
Langkah-langkah Membuat Daftar Isi Artikel Otomatis di Template VioMagz
Artikel ini akan memandu Anda langkah demi langkah untuk membuat daftar isi otomatis pada artikel di template Viomagz.
Berikut adalah langkah-langkahnya:
1. Buka laman blogger, pilih situs blogger yang Anda punya
2. Klik pada menu Layout yang ada pada sidebar menu sebelah kiri jika sobat membuka melalui dekstop
3. Setelah halaman berhasil dimuat, klik tombol edit berbentuk ikon pensil pada bagian Custom CSS
4. Kemudian salin dan tempelkan kode CSS berikut ke kotak yang disediakan. Jika sudah, klik tombol Save
5. Selanjutnya klik tombol edit berbentuk ikon pensil pada bagian Custom JavaScript Footer
6. Kemudian salin dan tempelkan kode JavaScript berikut ke kotak yang disediakan. Jika sudah, klik tombol Save
7. Sampai sini fitur ini sudah bisa Anda gunakan. Untuk membuktikan kita coba buat artikel baru. Caranya klik tombol New Post di sidebar sebelah kiri.
8. Buat artikel dengan struktur serupa dengan ini
9. Setelah selesai menulis, ganti mode editor ke mode HTML view
10. Tambahkan kode HTML berikut di tempat yang Anda inginkan (misalnya sebelum subjudul pertama). Kode ini nantinya akan meng-generate secara otomatis subjudul dari artikel dan membuatkan link yang sesuai.
Berikut adalah hasilnya:
Penutup
Demikianlah artikel mengenai cara membuat daftar isi artikel otomatis di template VioMagz. Dengan mengikuti tutorial ini semoga Anda berhasil menerapkannya ke blog Anda sendiri. Semoga bermanfaat.
Jika Anda suka dengan artikel serupa terkait tutorial dan blogging, Anda bisa mengunjungi rubrik Tutorial atau membaca artikel lainnya mengenai “Cara Mengganti Jenis Font pada Template VioMagz”.
Salam!