[Tutorial] Meminda Template - Header

Header - satu ruang yang paling atas sekali dalam sesebuah laman web. Biasanya header mengandungi imej atau logo. Setiap template Joomla kebanyakkannya diletakkan imej yang tidak sesuai dengan tema laman web dan ia perlu diganti dengan imej yang bersesuaian.

Cara-Cara Menukar Header



1. Login ke control panel
2. Klik Extensions > Template manager.
3. Klik template yang sedang digunakan (default)
4. Klik Edit CSS
5. Klik template.css, klik Edit

Fail css ini bermula dengan /* begin Page */. Scroll ke bawah hingga bertemu line;
/* begin Header */

div.art-Header-png
{
position: absolute;
z-index:-2;
top: 0;
left: 0;
width: 980px;
height: 150px;
background-image: url('../images/Header.png');
background-repeat: no-repeat;
background-position: left top;
}

div.art-Header-jpeg
{
position: absolute;
z-index:-1;
top: 0;
left: 0;
width: 980px;
height: 150px;
background-image: url('../images/Header.jpg');
background-repeat: no-repeat;
background-position: center center;
}
/* end Header */

Jadi, terdapat dua jenis imej yang digunakan untuk Header iaitu Header.png & Header.jpg yang terletak di dalam folder imej. Kedua2 imej bersaiz 980x150 pixel.

Menyemak Fail Imej
1. Dengan menggunakan Windows Explorer buka folder images
Lokasi: C:\xampp\htdocs\joomla\templates\eastorange\images
EastOrange adalah folder template yang digunakan (default)
Dari folder images, buka fail Header.jpg & png untuk semakan.

Buatkan 1 fail imej baru yang sesuai dan simpan dengan nama Header.jpg (980x150) dan fail Header.png bersaiz sama.

Upload dan gantikan kedua2 fail asal dengan fail imej yang anda buat sendiri.

Refresh dan Preview laman web. (guna CTRL+F5 untuk refresh laman web)

SELESAI