Tutorial Cantikkan Blog for Newbiee

Wednesday 9 November 2011 [ 0 ]

Langkah pertame Dashbord > Design . ekot pic yang aini sediekan okeyy ..

Lepas tekan .die jadi macam nie .

Then tekan back to blogger yang atas tuh tau <3 . Nanti die kelua macam nie .

Tekan edit html . Scroll kebawah ...dann tekan Select Layout Templates .

yang aini hitamkan tuh

Pilih denim templates :D

yang aini itamkan

Then korang tekan balik Edit Html .

korang search code nie <Variable name="headerBgColor" description="Page Header Background Color" .

bawah code tuh ade code code macam nie .

<Variable name="headerBgColor" description="Page Header Background Color"

type="color" default="#336699" value="#336699">

<Variable name="headerTextColor" description="Page Header Text Color"

type="color" default="#ffffff" value="#ffffff">

<Variable name="headerCornersColor" description="Page Header Corners Color"

type="color" default="#528bc5" value="#528bc5">

then korang copy code dibawah nie dah gantikan dengan code diatas .gantikan semue !

<Variable name="headerBgColor" description="Page Header Background Color"
type="color" default="transparent" value="transparent">
<Variable name="headerTextColor" description="Page Header Text Color"
type="color" default="transparent" value="transparent">
<Variable name="headerCornersColor" description="Page Header Corners Color"
type="color" default="transparent" value="transparent">

Okeyy ..lepas dah siap ..korang search code nie #content-wrapper { .
tgk anak anak code die dibawah .korang tukar dengan code yang aini bagi nie .tukar anak code die semue tau .mule dari #content-wrapper { sampai #sidebar-wrapper { .

#content-wrapper {
width: 920px;
margin: 0 auto;
padding: 0 0 15px;
text-align: $startSide;
background-color: $mainBgColor;
border: 3px solid $borderColor;
-moz-border-radius: 15px;
border-radius: 15px;
}
#main-wrapper {
margin-$startSide: 14px;
width: 530px;
float: $startSide;
display: inline; /* fix for doubling margin in IE */
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
margin-$endSide: 14px;
width: 340px;
float: $endSide;
display: inline; /* fix for doubling margin in IE */
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Lepas tuh .korang search code #header { .
then dekat bawah code tuh width die 760 kan ?korang tukar pergi 960 .okeyy ..

Untuk background image korang ..korang search code nie body { .
then copy code yang aini bagi dan gantikan code body { dengan anak anaknya dibawah .

background:$bgcolor;
Background-image:url( IMAGE BACKGROUND ANDA );
background-repeat: repeat;
background-position:Center center;
background-attachment:Fixed;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Last sekali .korang boleh tukar warne tulisan and warne background sidebar title delat tempalte designer .

Labels: tutorial