Kode HTML Untuk Membuat Daftar Isi dihalaman Blogger

Berbagi tutorial mengenai CSS & script atau kode HTML daftar isi halaman blogger, fungsi dari kode HTML ini adalah bisa untuk membuat sitemap atau daftar isi blogspot yang dapat diletakkan dihalaman blog. Kode HTML daftar isi nya itu adalah sebagai berikut:

<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="/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">

</script></div>

Contoh Tampilan Daftar Isi di Halaman Blog yang dibuat dengan kode HTML di atas adalah seperti ini!

Demo Daftar Isi seperti tampilan di atas adalah silahkan klik ini: solo.kursusforex.net/p/artikel-forex.html.

Langkah-Langkah Membuat Daftar Isi di Blogger adalah:

1. Login ke Dashboard Blogger.
2. Klik Halaman!
3. Klik Halaman Baru!
4. Klik HTML.
5. Kolom Judul Halaman ketik dengan Daftar Isi!
6. Copy paste CSS atau Script atau kode HTML Daftar Isi berwarna merah di atas di kolom content!
7. Klik Publikasikan!

Demikianlah info dari kami mengenai kode HTML daftar isi halaman blogger, mudah-mudahan dapat bermanfaat untuk Anda, silahkan mempraktekkan untuk memodifikasi daftar isi blog Anda, semoga Anda berhasil dan tampilan daftar isi blog Anda terlihat lebih cantik.