Tampilkan postingan dengan label Header. Tampilkan semua postingan
Tampilkan postingan dengan label Header. Tampilkan semua postingan

Rabu, 25 Maret 2009

Cara Menghilangkan Tajuk Blog

Tajuk untuk sesuatu blog memang penting bagi memberi gambaran kepada pengunjung mengenai blog tersebut. Cuma yang kurang bestnye text dan color yang disediakan oleh blogger tidak banyak pilihan dan kurang menarik serta susah untuk dipadankan dengan image di header. Biasanya kita akan menampilkan tajuk blog terus ke dalam image di header. Seperti blog ini.

Ok ada dua cara untuk menghilangkan tajuk blog di header. Cara pertama boleh rujuk disini "Memasukkan Gambar Di Header"

Cara kedua dengan menambah kod ini visibility:hidden; di bahagian header.

Dalam keadaan Loggin. Dibahagian Layout pilih Edit HTML. Cari kod lebih kurang begini.

#header h1 {
margin:50;
padding:5px 0 0 10px;
font-size: 100%;
font-weight:bold;
line-height: 1.2em;
letter-spacing:.0em;
font-style:italic;
color:#FFFFFF;
visibility:hidden;
}


atau..

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
visibility:hidden;
}


Tambahkan kod berwarna merah.

Ok siap...

Minggu, 15 Februari 2009

Cara Memasukkan Gambar di Header v2

Sebelum ni Ana dah buatkan tips untuk memasukkan sebarang gambar ke dalam header. Tutorial ni Ana buat khas untuk sahabat Manns'gor kerana tidak berjaya memasukkan gambar ke dalam header dengan tips sebelum ni. Sian Manns. sengihnampakgigi Ok caranya begini..

Sediakan gambar header berukuran 660x250 (tinggi ikut sukala) dan uploadkan untuk dapatkan linknya.. Mudah upload di Photobucket

1. Loggin => Layout. Kali ini kita ke bahagian Edit HTML. Cari kod dibawah..

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}


2. Tambahkan kod berwarna merah..

#header-wrapper {
background-image:url(http://i302.photobucket.com/albums/nn113/aburifaie/91.jpg);
height:250px;

width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}


3. Tukar link yang kelip² tu dengan link gambar Antum.Ini link header Ana. Xboleh guna. takboleTukarkan kod tinggi sekiranya gambar Antum lebih atau kurang dari 250px tinggi. Pastu klik preview dan lihat hasilnya.. Insyaallah gambar sudah muncul..

4. Tapi belum siap.. Border di dalam masih menyibuk kan.. Antum boleh buang atau besarkan die.. Cari kod ini, bawah sikit je.

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}


Kod merah tu ialah border, kalau nak buang delete aje.. kalau nak besarkan tambah dengan kod height:238px; seperti ini..

#header {
height:238px;
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}


Ok siap Alhamdulillah..

Kamis, 27 November 2008

Memasukkan Gambar Di Header

Header yang menarik dapat memberikan satu gambaran kepada setiap pengunjung blog kita.. Ana sangat suka bila terjumpa blog2 yang headernya menarik dan kreatif. Biasanya Ana lepak lama skitla kat blog depa sambil2 membaca entry yang disediakan. Ok ini cara yang disediakan oleh blogger untuk kita memasukkan sebarang gambar ke dalam blog header.

1. Loggin ke Blogger => Layout dan klik pada Edit Header

2. Paparan seperti dibawah akan muncul. Gambar yang akan dimasukkan mestilah sudah di'resize'kan mengikut saiz header dengan menggunakan sebarang software photo editing. Ana biasa guna "Adobe Photoshop".

3. Seterusnya Antum boleh 'upload'kan gambar kedalam header dari dalam komputer ataupun dari webhosting seperti Photobucket dan Imageshack. Kalau nak upload dari komputer, klik pada butang browse dari cari gambar tersebut. Masukkan link gambar sekiranya ingin upload dari webhosting.

4. Ok dah siap loading gambar yang di'upload' tadi?? Sebelum save, pilih kedudukan gambar samada dibelakang title "Behind title and description" atau sebaliknya "Instead of title and description"

Dah siap.....