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);
}
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&alt=json-in-script&callback=loadtoc"></script>
<script src="http://ade-technoit91.blogspot.com/ /feeds/posts/summary?max-results=1000&alt=json-in-script&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
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.
BalasHapusCukup 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)