Membuat Daftar Isi Modif Ala Mastamvan

Okey pada kesempatan kali ini kita akan membahas tentang cara membuat daftar isi blog seperti yang dipakai oleh Mas Teja / Blog Mas Tamvan

Untuk penampakan bisa kalian lihat dpada gambar dibawah ini.

Atau

DisiniClick here

Untuk pemasangannya ikuti langkah-langkah berikut :
1. Masuk Ke Blogger
2. Klik Pada Bagian Membuat Laman
3. Kemudian Buat Laman Baru, Beri Judul Sesuai Keinginan Kalian Masing-masing,
4. Lalu Copy Kode Dibawah Ini Dan Pastekan  Pada Bagian HTML Bukan COMPOSE

<style type="text/css">.post-body{background:#87D37C;margin:0;padding:0;position:relative;line-height:normal}.daftarisi a{color:white;text-decoration:none}.daftarisi{font-family:Roboto,sans-serif;font-weight:200;font-size:16px;line-height:1.5;padding:4rem 1rem}.daftarisi p{width:100%;text-align:center;background:#DDD;padding:5px 0 5px 0;margin:0px;font-weight:bold}.daftarisi p a{color:#443;display:block}.MasTamvan_postname{counter-reset:list-counter;display:block;margin-top:0px;padding-left:1em}@media(min-width:40em){.MasTamvan_postname{-webkit-columns:2 auto;-moz-columns:2 auto;columns:2 auto;-webkit-column-gap:2rem;-moz-column-gap:2rem;column-gap:2rem}}.MasTamvan_postname .kangTS{background-image:-webkit-linear-gradient(270deg,#ddd 0%,#ddd 100%);background-image:linear-gradient(180deg,#ddd 0%,#ddd 100%);background-repeat:no-repeat;background-size:2px 100%;background-position:1rem center;display:block;min-height:1rem;padding-top:0.3rem;padding-bottom:3.5rem;padding-left:3rem;position:relative}.MasTamvan_postname .kangTS:nth-child(odd)::before{background-position:center 90%}.MasTamvan_postname .kangTS:nth-child(even)::before{background-position:center 100%}.MasTamvan_postname .kangTS::before{background:#0082d5;background:-webkit-linear-gradient(270deg,#0082d5 0%,#a234d5 50%,#d74059 100%);background:linear-gradient(180deg,#0082d5 0%,#a234d5 50%,#d74059 100%);background-repeat:no-repeat;background-size:2rem 20rem;border-radius:50%;color:white;content:counter(list-counter);counter-increment:list-counter;display:block;height:2rem;left:0;line-height:2;position:absolute;text-align:center;width:2rem}.new{color:red!important;font-weight:700;font-style:italic}</style>

<script type="text/javascript">

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('f W(t){f s(){m("B"I t.C){2 s=t.C.B.8;J=s,d=0;9(2 a=0;s>a;a++){9(2 e,o=t.C.B[a],r=o.D.$t,l=o.X.$t.K(0,10),p=0;p<o.q.8;p++)m("Y"==o.q[p].L){e=o.q[p].w;x}9(2 i="",p=0;p<o.q.8;p++)m("Z"==o.q[p].L){i=o.q[p].w;x}2 n="";m("E"I o)9(2 p=0;p<o.E.8;p++){n=o.E[p].11;2 b=n.12(";");-1!=b&&(n=n.K(0,b)),4[d]=n,3[d]=r,5[d]=l,7[d]=e,c[d]=i,10>a?6[d]=!0:6[d]=!1,d+=1}}}}s(),v="F",G(v),M(),N=!0,O(),g.h()}f G(t){f s(t,s){2 a=3[t];3[t]=3[s],3[s]=a;2 a=5[t];5[t]=5[s],5[s]=a;2 a=7[t];7[t]=7[s],7[s]=a;2 a=4[t];4[t]=4[s],4[s]=a;2 a=c[t];c[t]=c[s],c[s]=a;2 a=6[t];6[t]=6[s],6[s]=a}9(2 a=0;a<3.8-1;a++)9(2 e=a+1;e<3.8;e++)"F"==t&&3[a]>3[e]&&s(a,e),"13"==t&&3[a]<3[e]&&s(a,e),"14"==t&&5[a]>5[e]&&s(a,e),"15"==t&&5[a]<5[e]&&s(a,e),"P"==t&&4[a]>4[e]&&s(a,e)}f M(){v="P",G(v);9(2 t=0,s=0;s<3.8;){j=4[s],y=t;Q t+=1;R(4[t]==j);m(s=t,H(y,t),s>3.8)x}}f H(t,s){f a(t,s){2 a=3[t];3[t]=3[s],3[s]=a;2 a=5[t];5[t]=5[s],5[s]=a;2 a=7[t];7[t]=7[s],7[s]=a;2 a=4[t];4[t]=4[s],4[s]=a;2 a=c[t];c[t]=c[s],c[s]=a;2 a=6[t];6[t]=6[s],6[s]=a}9(2 e=t;s-1>e;e++)9(2 o=e+1;s>o;o++)3[e]>3[o]&&a(e,o)}f O(){9(2 t=0,s=0;s<3.8;){j=4[s],g.h("<p/>"),g.h(\'<z A="16"><a w="/17/18/\'+j+\'" D="\'+j+\'" S ="T">\'+j+"</a></z><u A=\'19\'>"),y=t;Q g.h("<v A=\'1a\'>"),g.h(\'<a w="\'+7[t]+\'" D="\'+3[t]+\'" S ="T">\'+3[t]+"</a>"),1==6[t]&&g.h(\' - <z A="k">1b!</z>\'),g.h("</V>"),t+=1;R(4[t]==j);m(s=t,g.h("</U>"),H(y,t),s>3.8)x}}2 1c="1d",3=k u,7=k u,c=k u,5=k u,4=k u,6=k u,v="F",N=!1,1e=1f,1g="",J=0;',62,79,'||var|postTitle|postLabels|postDate|postBaru|postUrl|length|for|||postMp3|ii||function|document|write||MasTamvan_Labels|new||if||||link||||Array|sortBy|href|break|firsti|span|class|entry|feed|title|category|titleasc|sortPosts|sortPosts2|in|numberfeed|substring|rel|sortlabel|Tamvan_MenuisiLoaded|displayMasTamvan_Menuisi2|orderlabel|do|while|target|_blank|ol|li|SlideSeo_Blog|published|alternate|enclosure||term|lastIndexOf|titledesc|dateoldest|datenewest|MasTamvan_namaLabel|search|label|MasTamvan_postname|kangTS|New|periksa|100|numChars|250|postFilter'.split('|'),0,{}))

</script>

<br />

<div class="daftarisi">

<script src="https://slideseo.blogspot.com/feeds/posts/default?max-results=500&amp;alt=json-in-script&amp;callback=SlideSeo_Blog"></script>

</div>

Pengaturan :
- Ganti Kode Yang Saya Tandai Warna Merah Dengan Alamat/Url Blog Kalian Masing-masing

5. Langkah Terakhir Preview Terlebih Dahulu. Jika Sudah Sesuai Keinginan Klik Simpan Dan Publikasikan
6. Selesai.

Tambahan
Jika Terjadi Error Pada Tampilannya, Silahkan Cari Kode min-height,padding-top,padding-bottom
Setelah Ketemu Edit Pada Bagian Angkanya/ukurannya atau bisa juga me-Replace ketiga kode tersebut dan menggantinya dengan kode berikut
min-height:2rem;padding-top:1rem;padding-bottom:1rem;padding-left:3rem

Diposting oleh Mimin SlideSeo