Rapatkan header dengan content blog

Tutorial oh tutorial!

So untuk hari nie aku akan tunjukkan pula cara untuk merapatkan header dengan content blog. Maaf kalau ada suara² merdu bak buluh perindu yang bersuara di belakang mengatakan aku berlagak pandai. Aku berkongsi tutorial di sini atas permintaan rakan blogger. So kalau rasa diri dah pandai dan x perlu nak belajar boleh la pergi main jauh² ye! Di tegaskan tutorial yang di hasilkan di SR hanya sekadar untuk perkongsian bersama sahaja tanpa ada perasaan riak atau bangga. Kepada yang terasa tue ku pohon maaf! tak nak la asyik di cop macam tue je sakit hati nie dowh..

Ok kita teruskan dengan tutorial. Di ingatkan nak buat tutorial ini kena ada header transparent. Kalau tak tahu header transparent tue macam mane boleh rujuk di blog NIE. Bila dah ada header transparent baru kita boleh mulakan tapi kalau tak menjadi , itu bukan berpunca dari aku ye tapi ianya dari masalah template. Setiap orang tak sama templatenya. Jadi hari nie aku akan cuba tunjukkan tutorial untuk beberapa jenis template.

**************************************************

Untuk Template Classic yang macam aku guna nie tapi sebelum tue korang download full template terlebih dahulu takut terjadi apa² nanti at least dah ada back up.Than pergi ke

Step 1

Dashboard > Design > Edit Html > Tick Expand Widget

Copy code seperti di bawah nie- bagi memudahkan pencarian klik ctrl+F secara serentak dan copy code di bawah nie di dalam kotak kecil sebelah kanan atas dan kemudian ENTER.

#header {

Bila dah jumpa korang lihat pula code di bawah code tadi ada tulis macam nie

border:1px solid $headerBgColor;

Dah siap korang preview dulu kalau tak ada sebarang masalah boleh la SAVE.

*****************************************************

Step 2

Bagi mereka yang menggunakan Template Designer ~ Simple

Sama seperti step 1 , Dashboard > Design > Edit Html > Tick Expand Widget

kemudian korang kena buat header transparent. kalau tak tahu boleh tanya MDT.

Untuk step 2 nie korang kena pastikan ada background putih sikit di sebelah bawah header.Ok bila dah siap boleh la upload header seperti biasa.

*******************************************************

Step 3

Bagi mereka yang menggunakan template Picture Window

Dashboard > Design > Edit Html > Tick Expand Widget

Copy code seperti di bawah nie

.header-outer {

Dah jumpa coding tue korang gantikan code tue dengan code di bawah nie

Coding yang berwarna merah tue korang tukar korang tukar mengikut size width dan heightheader korang.

Pastu dah siap korang nak rapatkan pula dengan content kan!Jadi korang kurangkan sedikit size width.Sebagai contoh size asal header korang 300 lepas tue korang nak adjust sikit bagi rapat dengan content. than korang kurangkan la size tue kepada 250 ke! ikut pada korang kemudian preview banyak kali. kalau tak ok jugak adjust lagi sizenya. confirm mesti dapat. Coding korang annti akan jadi sebijik macam coding di step 2.

Dah siap SAVE la. Selamat mencuba