hay sobat, kali ini saya akan membahas tentang ''Cara Membuat Daftar Isi Dengan JQuery '' ,
langsung saja kita coba dan kupas caranya untuk para blogger sejati, berikut adalah caranya:
- Login ke blogspot.
- Klik Design/Rancangan.
- Edit HTML.
- Kemudian letakan kode dibawah ini di atas kode ]]>
#dafis-acc{
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333;
background:#ffffff;
}
.dafis-label {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9gzCsEb1OeAmo1FyEakAeIOavVsTiUZH3LKgywQ7E83ZeBeuAq0q6-Q-dZGBAL1oLtu8rMWFyd30SF3512UDdG9z1P8bGh7CkLwV7Wzt_j6M7hv45LzO2W0xehEAezq6ECjgxU6lV91M/d/bg4.gif") repeat-x scroll 0 0 #E1F4FB;
border: 1px solid #2F94BA;
color: #FFFFFF;
cursor: pointer;
font-weight: bold;
line-height: 1.4em;
margin: 1px 3px;
outline: medium none;
overflow: hidden;
padding: 2px 10px;
text-decoration: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
vertical-align: baseline;
white-space: nowrap;
}
.dafis-label:hover {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2mgSsMl7kivM0Du72S4YFmjmfJjxmRZa6vSK0tBPnD4p71Tq1EIbJI6W0iyg1adm_RmdkSeHvycdM6PhMEYcyu1YoXD3KRq6R6c7n4R17cEgNb68vrEMKj8RoxSnBdoaUUh_FYa4JddE/d/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;
border: 1px solid #339DC6;
line-height: 1.5em;
margin: 1px 3px !important;
text-align: left;
white-space: nowrap;
}
.dafis-daf ol li a {
color: #333333 !important;
display: block;
padding-left: 10px;
text-decoration: none !important;
}
.dafis-daf ol li a:hover {
background: none repeat scroll 0 0 #7BC4DF;
border-left: 5px solid #333333;
padding-left: 5px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}- Copy kode dibawah ini dan letakkan diatas kode
Tapi jika di blogmu sudah ada kode seperti ini maka kamu boleh meninggalkan langkah no 5 ini.
#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/AVvXsEhKf7S3aoAa7EKNS52D6QJzjOEEscxme-tEiBbe3XHMT3HPaCjEWFhfcngIM7qMMqOuVIceabt2zNdntuY6qb7aD8018HhE9q8TZqzvdrqps27fRegGr7hWFplUSuPGnThdryFc1QhUR9I/d/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9gzCsEb1OeAmo1FyEakAeIOavVsTiUZH3LKgywQ7E83ZeBeuAq0q6-Q-dZGBAL1oLtu8rMWFyd30SF3512UDdG9z1P8bGh7CkLwV7Wzt_j6M7hv45LzO2W0xehEAezq6ECjgxU6lV91M/d/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/AVvXsEj2mgSsMl7kivM0Du72S4YFmjmfJjxmRZa6vSK0tBPnD4p71Tq1EIbJI6W0iyg1adm_RmdkSeHvycdM6PhMEYcyu1YoXD3KRq6R6c7n4R17cEgNb68vrEMKj8RoxSnBdoaUUh_FYa4JddE/d/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); }
Ganti yang berwarna merah dengan URL blog kamu. selesei deh.
terimakasih.
No comments:
Post a Comment