Jumat, 05 April 2013
Design Sidebar Cantik
cantikan?suka gk?klw suka,praktekan ke blog kamu dong....hehehehhe XD
ini caranya :
1.Dashboard > template > edit HTML
2.Tick expand template widget > tekan F3/CTRL + F dan cari kode:
h2 {
margin: 0 0 1em 0;font: $(widget.title.font);color: $(widget.title.text.color);text-transform: uppercase;
3.Letakkan kode di bawah ini tepat di bawahnya:
text-shadow: 0 0 0.1em #A9A9F5, 0 0 0.1em #A9A9F5;
background:url(http://i1243.photobucket.com/albums/gg546/alice4ja/bcgn_zps321d0c8f.png);
text-align:center;
border: 1px dotted #A9BCF5;
border-right:5pt solid #FF95CA;
border-left:5pt solid #FF95CA;
margin:0 0 1.5em;
padding:7px 10px 7px 10px;
text-align: center;
margin: 0 0 1em 0;
font: bold normal 11px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
text-transform: uppercase;
color: #8E8E8E;
margin: .5em 0;
}
h2:hover {
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
}
Warna pink itu kode warna, merah url background dan yang bawah warna biru itu kode hover nya, kalau tidak mau menaruh hover ya gak usah ditaruh kode yang aku tandai dengan warna biru tapi cukup menaruh kode yang atas saja. Di bawah ini model h2:hover { yang lain:
h2:hover {background: #FFF url(http://i1243.photobucket.com/albums/gg546/alice4ja/bcgn_zps321d0c8f.png);-moz-border-radius: 5px;border-radius: 5px;-webkit-transition-duration: 1.0s;border-top: 1px dashed #ff7575;border-left: 4px groove #ff7575;border-right: 20px solid #ff7575;border-bottom: 1px solid #ff7575;}
4.Untuk menaruh border luar yang warna pink solid (jenis-jenis nama border) cari kode:
/* Widgets
.sidebar .widget {
Mungkin di bawah kode di atas masih ada kode bawaan dari blogger sebaiknya dihapus dulu kemudian letakkan kode berikut ini di bawahnya:
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border:1px solid #FF95CA;
margin:0 -5px 1.5em -5px;
padding:0px 7px 10px 7px}
}
5.Tekan pratinjau dulu dan simpan template.
6.semoga bermanfaat
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar
Leave A Comment Please (>^_^)> <(^_^<)
1.jangan menghina/menggunakan kata-kata kasar dsb
2.jangan tinggalkan link mati