Pages

Saturday, 2 July 2011

Tutorial : Background di Sidebar (Minima Templates)

Assalamualaikum :)
Apa khabar, reader? Lama Ajmal tak update Tutorial. Hehe, biasa la,, PMR candidates. Ok, background yang Ajmal nak ajar ni khas untuk Minima Template ja tau. Contohnya macam di bawah:

Mula-mula dekat Dashboard, tekan
Design - Edit HTML - Tick "Expand Widget Templates"
Kemudian cari

/* Sidebar Content
Kemudian copy code di bawah dan paste di bawah /* Sidebar Content tadi
.sidebar .widget {
background : #FBEFEF;
 -webkit-border-bottom-left-radius: 10px;
 -webkit-border-bottom-right-radius: 10px;
 -webkit-border-top-left-radius: 10px;
 -webkit-border-top-right-radius: 10px;
border-top: 3px dotted #F78181;
border-bottom: 3px dotted #F78181;
border-left: 3px solid #F78181;
border-right: 3px solid #F78181;
margin:0 -5px 1.5em -5px;
padding:7px 7px 7px 7px;
}
*Kalau nak tukar background tukarkan  #FBEFEF. Kod warna boleh cari kat Main Page Tutorial kat blog ni. Kalau nak yang pelbagai, cari kat sini. Kalau background tu nak guna gambar, highlight #FBEFEF dan gantikan dengan url(URL GAMBAR ANDA).
*Kalau nak tukar bentuk bucu border tu tukarkan 10px. Kalau korang tak minat dengan bucu bulat macam tu, korang hightlight
 -webkit-border-bottom-left-radius: 10px;
 -webkit-border-bottom-right-radius: 10px;
 -webkit-border-top-left-radius: 10px;
 -webkit-border-top-right-radius: 10px;
dan gantikan dengan jenis border yang korang suka. Jenis-jenis border boleh didapati di sini.
*Kalau nak tukar ketebalan line border, tukar 3px.
*Kalau nak tukar jenis line border, tukar dotted. Jenis-jenis line border boleh tengok kat Main Page Tutorial di blog ni.
*Kalau nak tukar warna line border tu, tukar #F78181.

Kemudian, preview dulu baru save ok! Selamat mencuba!

No comments:

Post a Comment