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]:

Nurul Anisah said...

Dah jadi.Thanks for the tutorial :)

Shabrina L. Rais said...

ukuran headernya bebas kah?

Arina Azman 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 ._.

Fatin Nur'Aqillah said...

dah jadi.Tq