Tutorial : Header with Box {Blogskin}


Assalamualaikum and annyeonghaseyo. Tutor yang seterusnya tieqa nak share cara utk buat header mcm blog ni. Nampak tak header dalam kotak tu? Ha! itulah. Btw tutor ni tieqa credit to AtinTory. Thanks for allowed me to re-tutor this tutorial. Okay. Let's start.

{ example }

1. Dashboard > Template
2. Tekan Ctrl + f serentak dan cari code </style>
3. Copy code di bawah ni

<center>
<div style="margin-top:15px;">
<div style="display:inline-block;width:900px;padding:5px;border-radius:0px 0px 0px 0px;border:2px solid #FFDFEA;background: url(BACKGROUND);">

<div style="display:inline-block;width:900px;padding-top:275px;border-radius:0px 0px 0px 0px;border:0px dotted #FFDFEA;border-bottom:none;background-repeat:no-repeat;background: url(URL HEADER);"></div><br>

</center>
<center>
<div style="margin-top:-1px;margin-bottom:-3px;background:none;border-left:30px solid #FFDFEA;border-right:30px solid #FFDFEA;width:600px;height:40px;">
</div>

4. Paste di bawah code </style>
5. Preview & save.

Biru : background header
Pink : URL header
Oren : warna border header
Hijau : Lebar {width}

{ Untuk template designer, boleh request kemudian }

7 comment [s]:

anshmnf said...

Dah jadi.Thanks for the tutorial :)

Shabrinalr said...

ukuran headernya bebas kah?

rinnrin said...

unnie, saya punya blog gambar dia tak habis la .. macam mana nak bagi penuh ?

NorSyuhadaYahaya said...

Thanks :) Menjadi :D

fatinaziz said...

knp dia ada dkt tmpt lain buakn dkt atas mcm header yg lain :(

atiqahjaidin said...

@fatinaziz tempat lain? maksudnya ._.

Unknown said...

dah jadi.Tq