Membuat Daftar isi dengan icon di samping

Mau Buatin Daftar isi dengan icon di samping???
Caranya gini…
1. Login ke Blogger.
2. Buka menu Layout -> Page Elements
3. Klik Add a Gadget -> HTML/Javascript.
4. Paste kan script yang di bawah ini… jadi deh…

<style>
.list {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_yvZUfzo5AXRPBjr7WqqsEbzpPEe_nXbMkoz0W4jzUlHCxLmHyTsDd-QmJDKH1yHWT2Knhwl0a8SRdaUM7HN3M1kSRG530oErCxUIv_0qCC_wXRxfINHNSd80UOSntWFyzdwbvacl4ToI/") no-repeat left center;border-bottom:1px dotted #ddd;line-height:1.2em;padding:3px 0px 0px 20px;
}
</style>

<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:284px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">

<div class="list">
<a href="http://karokabanjahe.blogspot.com/ ">Mengubah Post Comments</a></div>

<div class="list">
<a href=" http://karokabanjahe.blogspot.com/">Membuat Alert Ucapan Terimakasih</a></div>

<div class="list">
<a href=" http://karokabanjahe.blogspot.com/">Script Kode Warna"</a></div>

</div>



Daftar isi menggunakan angka disampingnya
Script nya seperti ini.

<style>
.list {
border-bottom:1px dotted #ddd;
line-height:1.2em;
padding:3px;
}
</style>

<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:380px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">

<div class="list">
1. <a href=" http://karokabanjahe.blogspot.com/">Judul Alamat Url</a></div>

<div class="list">
2. <a href=" http://karokabanjahe.blogspot.com/">Judul Alamat Url</a></div>

</div>

Keterangan:
380px merupakan lebar kotak, 180px merupakan tinggi kotak, #ffffff pada background-color merupakan warna background, dan #ffffff pada border merupakan warna garis pinggir. Silahkan diganti sesuai dengan template anda.
Ingat:
Ganti tulisan yang berwarna Merah dengan alamat postingan anda dan ganti tulisan berwarna Biru dengan judul postingan anda. Jika anda ingin menambah postingan baru maka copy kode yang berkedip lalu letakkan diatas kode </div>
Jangan lupa untuk mengganti angkanya dengan angka 3 dan begitu seterusnya jika anda ingin menambah postingan baru lagi. Kalau sudah klik Save Template.
Selesai dech…

Salam : Kesain Rumah Derpih

Share: