Saturday, 28 July 2012

Border At Post Tittle & Sidebar

Assalammualaikum
Smiley ^_^


Nak buat macam kak bawah ni ? Jom ikut step Nurul.




POST TITTLE

1) Design > Edit HTML > Tick Expand Widget > F3 and search this code.
SIMPLE TEMPLATE ATAU SEANGKATANYA
h3.post-title, .comments h4 { 
or
h3.post-title {
or
h3.post-title, h4 {
DENIM TEMPLATE
.post-title {
MINIMA TEMPLATE
.post h3 {

2) Kat bawah tu ada kod ni kan ? TOLONGLAH DELETE !!
Simple Template
font: $ (post.title.font);
margin: .75em 0 0;
}


Denim Template
margin: 0;
padding: 0;
font-size: 125%;
font-weight: bold;
line-height: 1.1em;
 3) Lepas korang buang tu. korang gantikan dengan kod ni.
font-family:arial;
color: #000000;
font-size:14px;
text-align:center;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-top-right-radius: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom: 8px solid #000000;
background : #FFFFFF;
padding: 3px; margin: 20px ;
}
4) Preview dulu baru save.

ABC : Ketebalan border yang warna hitam tu
ABC : Tukarlh kalau rasa nak tukar. solid/dashed/dotted
ABC : Kalau nak tukar , tukarlah.
ABC : background post tittle korang. Cari warna kat sini.

SIDEBAR
1) F3 and search this code.
SIMPLE TEMPLATE
h2 {
DENIM TEMPLATE
.sidebar h2 {
MINIMA TEMPLATE
h2 {
2) Tolonglah delete kod kat bawah ni kalau korang ada jumpa kat bawah code yang Nurul suruh cari.
SIMPLE TEMPLATE
margin: 0 0 1em 0;
font: $(widget.title.font);
colour: $(widget.title.text.colour);
text-transform: uppercase;
}
DENIM TEMPLATE

margin: 1.6em o .5em;
padding: 4px 5px;
background-colour: $sidebarTitleBgColour;
font-size: 100%;
colour: $sidebarTitleTextColour;
}
3) Gantikan dengan kod kat bawah ni.

text-align:center;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-top-right-radius: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom: 5px solid #000000;
background : #D8D8D8; font-size:14px;
padding: 2px;
margin: 5px
}
4) Preview and save.

ABC : Ketebalan border kat bawah
ABC : Just choose one : solid/dashed/dotted
ABC : Warna border kat bawah
ABC : Warna background
ABC : Size font korang
ABC : saiz border. Semakin besar no. semakin besar border korang

Maaflah sebab entry ini panjang berjela. Jemput-jemputlah komen.






7 comments:

fiqah hamed said...

menjdai..done creditt too.. (:

Nurul said...

Alhamdulillah

Nurul Ain Atikah said...

emm, kalau blogskin? hehe banyak tanya

Nurul said...

Maaflah, Nurul tak guna Blogskin. Nurul tak tahu code-code blogskin ni.

Ainur Athikah said...

Pandainya buat tuto.

Nurul Fatihah said...

Tak adalah. Simple je.

Ieta Mat Saad said...

Terima kasih tutorial ni :) done follow

m
e
s
s
a
g
e
 
This blog+author+design fully edited and the designer is Nurul. Don't steal my design !