Cara Membuat Daftar Isi di Blog

ICT POLGAN - Seperti buku pada umumnya terdapat Daftar isi untuk memudahkan pembaca menemukan bagian yang ingin dibaca terlebih dahulu. Artikel ini memandu bagaimana cara membuat daftar isi pada blog. Tampilan yang akan digunakan seperti pada gambar ini :

Langkah awal :
1. Pastikan sudah login pada Blogger

2. Arahkan kursor dan Klik pada bagian Page/Laman lalu "Create / Laman Baru"

3. Pada bagian Halaman rubahlah tab mode Compose menjadi HTML terlebih dahulu. Kemudian Copy Script di bawah ini dan paste-kan di halaman yang sedang kita buat.
Note :
- Ganti kode yang berwarna Merah dengan alamat Url blog anda.

<style type="text/css">

#toc{

width:97%;

margin:5px auto;

border:1px solid #00a3c1;

-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:#ff0000;

font-weight:bold;

margin:0 -5px;

padding:1px 0 2px 11px;

background:-moz-linear-gradient(right,#C2EAFE 0%,#00a3c1 40%);

background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#00a3c1),color-stop(1,#C2EAFE));

border:1px solid #00a3c1;

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{t

ext-transform:uppercase;

}

.new{

color:#ff0000;

font-weight:bold;

font-style:italic;

}

.postname{

font-weight:normal;

background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%);

background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));

}

.postname li{

border-bottom: #ddd 1px dotted;

margin-right:5px

}

</style>


<br />
<div id="toc">
<script src="https://cdn.rawgit.com/aramdan/share/master/sitemap.js" type="text/javascript"></script>

<script src="http://ictpolgan.zone.id/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">

</script></div>