Membuat Daftar isi Keren pada Blog


Pada tutorial kali saya akan berbagi informasi tentang ilmu blog di antaranya adalah Membuat Daftar isi Keren pada Blog.Daftar isi adalah informasi mengenai semua isi dari blog yang kita miliki sehingga memudahkan para pengunjung mencari informasi yang mereka butuhkan pada blog tersebut,daftar isi juga berfungsi untuk mengkelompokan artikel agar lebih tersusun rapi sehingga enak di lihat oleh pengunjung,, oke langsung saja saya disini akan membuat daftar isi dengan tampilan yang keren tidak seperti biasanya yaitu dengan jQuery…

o   Login ke blog anda
o   Masuk ke rancangan pilih Edit HTML
“Jangan lupa centang Expand Widget Template agar terjadi kesalahan kita bisa kembalikan template seperti sedia kala”
o   Masukan kode di bawah ini tepat di atas kode  ]]></b:skin>
#dafis-acc{
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigIPdb0ut0yBdSbxmCATt7_w37iH8SlsuG7UcbZBHyvjYgzrXYbe5FJXzXF07dZbzswBXkqleqJQl0XRGkQawbxkEnPAourqfKPeCslrbiB3ySFklae7hUOleaZl_l4d6oagvZhcCNwao/s320/bg5.gif) repeat-y scroll left center #E7F7FB;
padding:2px0;
border:1pxsolid#339DC6;
}
.dafis-label{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMmG6e7Td3Dv2rnlC8au2fuguiFLjzzYSTsNN1qgYbudguca7XSLSPcIkUy1gHErb2D-BfHVt4Ff20Q3pZB9rGhsW3RD89faCXyZThIAdKjwzJHLRHx3dHNfEaAQ6IUyjef4WCCjwol8g/s1600/bg4.gif) repeat-x scroll 0 0 #E1F4FB;
font-weight:bold;
line-height:1.4em;
overflow:hidden;
white-space:nowrap;
vertical-align: baseline;
margin: 1px 3px;
outline: none;
cursor: pointer;
text-decoration: none;
padding: 2px 10px;
color: #fff;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
border:1px solid #2F94BA;
}
.dafis-label:hover{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1zwxKKc2E49xwF84ePNepA-NLSi9lotuEaSafdKJxRFV5PsQiAncZ6fHAAYP10KHLxj9qv84Q-fsG68aGvxQiYlS2KKNpuhhdAWrFLuvJV0JVgZCH64TqeWLnlek64bBImwFsPQqQLfs/s320/bg2.gif) repeat-x scroll 0 0 #E1F4FB;
color:#003366;
}
.dafis-daf ol{
margin:0 0 0 30px !important;
padding:0 !important;
}
.dafis-daf ol li{
background-color:#C9E9F4;
line-height:1.5em;
margin:1px 3px !important;
white-space:nowrap;
text-align:left;
border:1px solid #339DC6;
}
.dafis-daf ol li a{
text-decoration: none !important;
color:#333 !important;
display:block;
padding-left:10px;
}
.dafis-daf ol li a:hover{
background: #7BC4DF;
border-left: 5px #333 solid;
padding-left: 5px;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
o   Selanjutnya letakan kode di bawah ini tept di atas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
o   Setelah selesai klik pratinjau untuk memastika benar atau tidaknya pemasangan kode script tersebut,, setelah itu baru di save.
o   Jika semuany sudah langkah terakhir kita masuk ke tata letak ->Add widget ->Pilih HTML\JAVASCRIPT
o   Kemudian copy paste kode di bawah ini di dalamnya
<script type="text/javascript" src="http://cayun-code.googlecode.com/files/Acc1.js"></script>
<script src="
http://ade-technoit91.blogspot.com/ /feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>

o   Kemudian save… selesai

Nb: ganti tulisan yang berwarna merah di atas dengn alamat blog anda masing masing…
Sekian dulu tutorial dari saya semoga bermanfaat buat kita semua amiiinn….
Referensi lihat di sini



1 komentar:

  1. Salam untuk kalian para member setia S1288poker, bagi kalian yang ingin bergabung bersama kami di S1288poker kalian bisa langsung saja mendaftarkan diri kalian disini dan ajak teman kalian untuk bermaian di S1288poker,com dapat kan bonus juga bonus freechips setiap hari nya.
    Cukup dengan deposit Rp. 10.000,- saja kalian sudah dapat bergabung bersama kami dan nantikan bonus-bonus menarik dari kami dan juga permainan seru lainnya hanya di s1288poker Agen judi poker terbaik dan terpercaya. (WA : 08122221680)

    BalasHapus