Friday, June 5, 2009

Tutorial Background Post Header


Tutorial kali ni datang daripada request Cikgu Naman, nampak tak gambar anak panah merah kat atas tu? Itulah yang dinamakan Post Header (Tajuk Post), untuk memuatkan gambar pada tajuk post tersebut anda perlu mencipta gambar header melalui photoshop atau sebagainya, dan lebar (Width) untuk gambar tersebut mestilah tidak melebihi lebar #main-wrapper.

#main-wrapper {
width: 480px; <--- Lebar
padding-top:25px;

padding-left: 10px;
padding-right: 10px;

Contoh gambar background header post :


Berikut adalah langkah² membuat Background pada Post Header :

1. Login ke ID Blogger atau terus ke Dashboard
2. Kemudian Pilih Layout dan terus ke tab Edit HTML
3. Carik code .post h3 { dengan menekan Ctrl + F (Find) dan tambahkan code seperti di bawah



4. Setelah selesai meletakan coding tersebut pastikan ianya seperti dibawah ini kemudian SAVE TEMPLATE


Tambahan
Anda perlu upload gambar background untuk mendapatkan link-gambar seperti coding didalam kotak diatas. Terdapat banyak web hosting untuk anda menyimpan gambar seperti geocities, photobuckt, imageshack ataupun dengan akaun google site seperti gambar di atas.

Anda memerlukan coding tambahan seperti di atas jika tulisan tajuk post header terlalu ketepi dengan menggunakan codding padding-left.

Selamat mencuba :)

3 comments:

n@m@n said...

lor..ada nama aku eh..hehe..aku dh buat..tgk kt tutorial lain..hehe..tp ko pnye lg detail..bgus2..toche..toche..nt nk edit blk yg dh buat...TQ

Luth Textile said...

cun.. tq..

NoRMa aZurA iSMaiL said...

salam...
saya try buat tapi xleh...
bila search .post h3{ result 0
xleh buat..huhuuhu..