Cara Membuat Daftar Isi di Blog

Daftar isi adalah salah satu bagian terpenting dalam sebuah blog atau website. Daftar isi tersebut berisikan kumpulan artikel atau link yang terdapat pada sebuah blog atau website. Dengan adanya daftar isi di blog kita, mesin pencari seperti Google, Bing, Yahoo akan lebih mudah menemukan setiap artikel di blog kita.

Tutorial Membuat Daftar Isi di Blog

1. Pertama login ke akun Blogger kita, lalu pergi ke dashboard blog kita. Pilih menu Halaman dan klik HALAMAN BARU.

Cara Membuat Daftar Isi di Blog

2. Kemudian ubah dari Tampilan menulis menjadi Tampilan HTML.

Cara Membuat Daftar Isi di Blog

3. Beri judul dengan “Daftar Isi” dan isi bagian HTML View masukkan script di bawah. Ganti teks berwarna merah dengan alamat blog kalian, kemudian klik Publikasikan.

<style type=”text/css”> #toc{width:99%;margin:5px auto;border:1px solid #2D96DF; -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);} .labl{color:#FF5F00;font-weight:bold;margin:0 -5px; padding:1px 0 2px 11px;background: #3498DB; border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;} .labl a{color:#fff;} .labl:first-letter{text-transform:uppercase;} .new{color:#FF5F00;font-weight:bold;font-style:italic;} .postname{font-weight:normal;background:#fff;margin-left: 35px;} .postname li{border-bottom: #ddd 1px dotted;margin-right:5px} </style> <div id=”toc”> <script src=”https://cdn.jsdelivr.net/gh/penaindigo/Pena-Indigo-Code@a134f9def601a6f77332eccc35d3d20e0d3c7e49/sitemappenaindigo.js” type=”text/javascript”></script> <script src=”https://www.wikuta.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc”> </script></div>

Cara Membuat Daftar Isi di Blog

4. Hasilnya akan seperti gambar di bawah.

Cara Membuat Daftar Isi di Blog

Tampilan daftar isi tersebut simpel dan elegan. Bagi kalian yang menginginkan tampilan daftar isi yang berbeda, kalian bisa mencoba mencari script daftar isi lain di Google dengan kata kunci “script daftar isi di blog“.

Leave a Comment