2 Cara Membuat Daftar Isi HTML

Getartikel.com – 2 Cara Membuat Daftar Isi HTML Sebenarnya untuk membuat daftar isi itu sangat lah apalagi jika kalian menggunakan WordPress di wordpress kalian tinggal menginstal plugin saja masalah beres, sesimple itu jika menggukan wordpress akan tetapi jika kalian menggukan blogspot tentunya harus manual maka dari itu ini akan saya berikan beberapa cara yang bisa kalian coba.

Cara Membuat Daftar Isi Di WordPress

1. Pertama klik plugin lalu tambah baru, lalu ketik di pencarian “table of content” pilih seperti gambar di bawah ini.

2. Klik install sekarang lalu aktifkan plugin, setelah itu kalian bisa ke pengaturan lalu pilih table of content di sini kalian bisa mengatur warna font dan lain lainnya sesukan kalian 2 Cara Membuat Daftar Isi HTML.

3. Untuk menggunakannya pas kalian membuat postignan apa page kalain tambah kan table of konten/daftar nya, secara otomatis plugin ini akan memebaca H2, H3 kalian sebagai daftar isi tidak perlu susah susah mengatur manual lagi.

Cara Membuat Daftar Isi Di WordPress Manual

Buka WordPress kalian masing masing lalu buat post baru.

1. Tambahkan blok html khusus Lalu kalian paste kan codeingan di bawah ini

<div style="margin-top: 5px; margin: 20px;">
    <div class="smallfont" style="margin-bottom: 2px;">
        <b>DAFTAR ISI</b>: 
<input onclick="if ( this
    .parentNode
    .parentNode
    .getElementsByTagName('div')[1]
    .getElementsByTagName('div')[0]
    .style
    .display != '' ) { this
    .parentNode
    .parentNode
    .getElementsByTagName('div')[1]
    .getElementsByTagName('div')[0]
    .style.display = ''; this
    .innerText = ''; this
    .value = 'Hide'; } else { this
    .parentNode
    .parentNode
    .getElementsByTagName('div')[1]
    .getElementsByTagName('div')[0]
    .style.display = 'none'; this
    .innerText =''; this
    .value = 'show'; }" style="margin: 0px; padding: 0px; width: 150px;" type="button" value="Show" />
</div>
<div class="alt2" style="border: 0px inset; margin: 0px; padding: 0px;">
<div style="display: none;">
<ul>
<li><a href="#1">Judul 1</li>
    <ul>
    <li><a href="#2">Judul 1.1</li>
    <li><a href="#3">Judul 1.2</li>
    <li><a href="#4">Judul 1.3</li>
    <li><a href="#5">Judul 1.4</li>
    </ul>
<li><a href="#6">Judul 2</li>
<li><a href="#7">Judul 3</li>


</lu>
</div>
</div>
</div>

2. Lalu di setiap heading yang kalian buat jangan lupa sertakan id 1, 2, 3, dan seterusnya. Sesduah kalian mengaturnya kalian tinggal publish postingan kalian. Demikian 2 Cara Membuat Daftar Isi HTML.

Baca Juga : Cara Menambahkan HYPER LINK di HTML