Cara Mengubah/Memasang Gambar Background Header di Blogger/Blogspot
| Tweet |
Cara ini digunakan untuk mengubah/menambahkan gambar header secara keseluruhan sebagai background/latar. Jika hanya ingin mengganti/memasang gambar header pada judul dan deskripsi, cukup masuk ke Page Elements dan klik edit pada widget judul dan deskripsi pada bagian header. Upload gambar anda melalui fitur upload yang telah disediakan.
 |
| click to enlarge |
1. Masuk ke Edit HTML.
2. Cari (Ctrl+F) #header-wrapper atau yang sejenisnya (masing-masing template tidak sama tergantung basic template tersebut). Declarator ini selalu di bagian pengaturan header dan posisinya paling atas.
Contoh:
#header-wrapper{background-color:#00000;width:975px;margin:0 auto 0;height:125px;)
3. Tambahkan atribut ini sebelum background-color (atau anda dapat menghapus bagian background color jika header anda akan dipenuhi dengan gambar):
background image: url(http://alamat-url-gambar/gambar.jpg);background-repeat: no-repeat;
#header-wrapper{background image: url(http://alamat-url-gambar/gambar.jpg);background-repeat: no-repeat;background-color: #00000;width:975px;margin:0 auto 0;height:125px;)
Atau aturan shorthand untuk background juga dapat digunakan:
contoh:background:url(http://alamat-url-gambar/gambar.jpg) no-repeat #000000;
#header-wrapper{background:url(http://alamat-url-gambar/gambar.jpg) no-repeat #00000; width:975px;margin:0 auto 0;height:125px;)
Ganti http://alamat-url-gambar/gambar.jpg dengan direct url dimana anda mengupload gambar header blog. Sebelum mengupload & memasang gambar header, edit atau pastikan ukuran gambar sama dengan width dan height header blog.
4. Save template.
Jika ada pertanyaan, permasalahan, atau apa saja, silakan gunakan form comment.
mencuri adalah pekerjaan pengecut! © buka-rahasia.blogspot.com
Cara Mengubah/Memasang Gambar Background Header di Blogger/Blogspot
Written by: Ahmad Khoirul Azmi
Rating: Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan code ini atau share dengan Facebook like diatas/sharing tool di bawah. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
Written by: Ahmad Khoirul Azmi
Rating: Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan code ini atau share dengan Facebook like diatas/sharing tool di bawah. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
kok di edit html saya g ada y mas??
tlng bantuannya..
thx
Yang tidak ada kode apa?
#header-wrapper nya mas...
td udah aq cari pake ctrl+f tp g ada tuh mas?...
maklum mas masih cupu jd masih rada binggung..
mohon bimbingan & bantuannya y mas..
gini mas..aq mau masukin hasil kode html yg aq buat di www.cooltext.com bt aq pasang di font header..aq udh ikut panduannya mas Ahmad..tp giliran masukin di edit html malah g ada tuh mas..udh aq search pake ctrl+F tp jg g ada..jd binggung hrs masukin kodenya dimana..
setelah saya liat, aturan css header and tidak mengunakan id #header-wrapper.
cari ini:
.header-outer {
margin: 0 0 0 0;
background: transparent none repeat scroll 0 0;
}
masukkan url gambar yg telah diupload sesuai dengan cara yang telah diuraikan di posting.
pada bagian background yang saya cetak miring ganti atau tambahkan aturan seperti contoh di atas jg. Buat width/lebar dan height/tinggi sesuai dengan ukuran pixel gambar.
trima kasih mas Ahmad atas bantuannya..
oh iya mas, mohon bimbingannya ya..saya baru belajar dalam dulia bloging..
dari pertama kali saya bloging, situs blog mas Ahmad jd referensi saya.
klo mas Ahmad g keberatan saya bisa minta Alamat email mas Ahmad?untuk share dan berguru.hehe..
thx B4
Makasih atas tips2nya.. Visit my blog http://arieeraya.blogspot.com
Judul headernya emang harus di isi ya ?
ya, itu untuk memberi title blog
nggak bisa mas sulit,q dah coba beberapa kali tetap nggak bisa
saya coba gan.....
makasih mas.... infonya.
jadi berat ngga gan loading blognya?mohon petunjuk..makasi
manfaat banget nich postnya..
mas ..saya masih belum ngerti..setelah ctr+F..ko gak bisa muncul muncul ya
asslm....
mas kalau kasusnya headerq pake fto tu gmn?jadi untuk judul blognya udah paten meski dh ganti nama blog.fotonya tu bawaan template.jadi q cm bs ganti nama jg pk foto.solusinya menurut mas gmn?
o y...mampir jg d blogQ y...thanks
bagaimana membuat blog-wrap seperti blog ini ?
request artikel MODIFIKASI TEMPLATE BLOGSPOT (Background, main, footer).
ilmunya aku coba dulu mas. aku coba edit header qu, pertamanya dia ngelink ke sini :
http://1.bp.blogspot.com/-Z0DPwnf-Leg/TrltSDNgeWI/AAAAAAAABCU/nDvkeEQ7q4c/s1600/bg_header.PNG
ternyata warna putih, terus aku gak mau ganti gambar cuma mau ganti warna doang, apa perlu kita upload image juga seperti link yg di atas, atau hanya kita kasih kode css warna
informasinya sangat bermanfaat sekali, salam kenal and visit me back
Ikut nyimak tips nya pak,sangat bermanffat buat saya.maksih pak,salam kenal ya...
wah mantap gan!
Asyiiiikk...udah sukses ganti gbr header...trims for your share
Mas saya pengen nanya nih header yg mas pke di atas itu ^^ ukurannya brp? keknya sama ama Blog saya itu ukurannya
thx gan, ane bru belajar ni.....
Trnyata ribet jg ya ganti header diblogspot, nggk kek diwordpress, gampangg :-D
Salam knal aLL
gan kalo pengen kasih headernya pake flash atau format *.swf bijimana??yang diatas kan untuk format jpeg :bingugng
agak panjang sob, penjelasan dan kodenya. Jadi nanti ke depan saya posting saja ya di blog. Ini antrian artikel pesanan sobat yang lain juga banyak sekali, jadi nanti ditunggu dulu ya.,, :)
gan ane newbie
edit html dapat dimana yah?
Darii dashboard blogger > Deign/Layout (kalo dashboard ) baru pilih "template") > Edit HTMl?Edit Template
udh dapat bos,
trus kasus gua sama dengan agan yodyy, ga ada #header-wrapper nya bos :)
mohon pencerahan.
Bagaimana kalo membuat daftar kategori kaya di blog ni?
klo sy mau ganti logo bgmn ya gan?
Cari gambarnya di mana?
kalo pake template xml bisa gak ??
Thanks infonya...
Trims,ternyata saya harus banyak belajar.....
ko azmi mau tanya nih , metode yg saya gunakan untuk cara diatas(artikel) Css Style keq gini;
#header
{
background-image:url(http://i1267.photobucket.com/albums/jj544/Michael_Steven1/header_5.jpg);
background-repeat:no repeat;
width:1000px;margin:0 auto 0;height:150px;)
}
tapi koq diatas gambarnya ada celah kosong gitu jadi keliatan kga bagus... mohon bantuannya yah
Blog : "Ideas for Life"
itu berarti masih ada elemen wrapper lain selain wrapper nya header, atau kalo tidak tinggi gambar enggak sesuai dengan tinggi yang kamu buat di atas (kurang dari 150), coba height nya tidak usah dispesifikasikan saja, jangan kasih nilai height, cukup width saja and liat gimana hasilnya.
Hmmm.... ini yg dicari-cari.. Saya coba dulu deh Admin... Makasih ya,Maju Terus Blogger Indonesia..!!!
bagus mas ,, tapi klo baground nya mau sama seperti blog mas bagai mana caranya mas,, tolong ya,,
alamat blog aku ini mas
http://abangdaka.blogspot.com/
Thanks agan sudah berbagi. sudah brhasil juga di blog ane. mohon dukungannya sobat di kontes ane di keretaminiku.com produsen kereta mini mainan di indonesia. sebelumnya thanks atas artikeelnya.
makasih infonya
nggak mudeng bangeetttt...
mohon bantuannya..
gan kalau cara mengubah lebar backgraund gimana?
mohon bantuan nya
Mau tanya, ko' di template sy ga ada :
1.#header
2..header
Mohon pencerahan.
http://reloaduit.blogspot.com/
bungsuputera@gmail.com
CSS header pada blog anda menggunakan class: .header-inner
jadi cari .header-inner
Makasih infonya gan. ane bingung nyarinya..akhirnya ketemu juga.. mantap
gan tolong dibantu gan,,
saya mu ganti header dengan gambar cuman gak pakek alamat URL bisa gak gan,,,
mohon pencerahnnya gan
http://didalamrenunganku.blogspot.com/
http://belajar-untuksukses.blogspot.com/
gan aku bingung nih mu di tarok di mana,,,
mohon bantuannya gan,,
http://didalamrenunganku.blogspot.com/
SUMPAH Gan Ane Kagak Ngerti ne ..
Masalah nya ane kan baru NEWBIE :D..
Tolong Dong Share Video Atau Screenshot yang jelas ..
please gan ..
ane dah 2jam ne mondar mandir di blog agan ..
tetap ajah Bingung and Kagak ngetir2 :(
Tolong Dong Panduan ya gan :)
my blog: adhe-silawane.blogspot.com
aku bingung ni kok headerku aku ganti dengan gambar yang kerlip2 kok kerlip2nya nggak bisa ya, dia hanya diam saja,
tolong bantuannya ya..........
makasih.......... :)
Sudah berhasil saya pasang bang, makasih.......
Post a Comment