Cara Mengubah/Memasang Gambar Background Header di Blogspot/Blogger
Fasilitas Blogspot menyediakan penambahan gambar ke header blog. Kita bisa memasang gambar yang akan menjadi background header blog di bagian widget. Gambar header merupakan cirri khas suatu blog. Meskipun templatenya sama tapi biasanya headernya berbeda. Sebelumnya siapkan terlebih dahulu gambar yang akan di upload. Dan sesuaikan ukuran panjangnya (umumnya sekitas 850 px) dan lebar gambar dengan kolom widget header gambar itu sendiri. Ukurannya bisa disesuaikan dengan template anda, gambar yang disediakan sebaiknya di edit di software pengolah gambar seperti paint atau photosop untuk mememotong dan mengatur ukuran gambar. Agar terlihat lebih rapi sehingga tidak ada ruang kosong pada kolom widget header.
Cara memasang gambar template standar blogspot:
Klik Desain..
Klik Tata Letak.
Klik Simpan.
Untuk mengetahui lebar kolom pada gambar,silahkan lihat di edit
pengaturan template sesuaian.
Terakhir Klik TerapkanBlog
Cara Memasang Gambar Header di edit HTML template :
Untuk mengetahui linknya klik gambar header. caranya klik kanan mouse,
pilih view background image.
Kemudian buka Edit HTML template
Silahkan paste kode tersebut pada kolom Find( Klik CTRL+F dan pastekan
kode tersebut ) dan Klik Enter maka akan terlihat/terseleksi link tersebut.
Kemudian ganti link gambar tersebut dengan link gambar Sahabat.
Klik Pratinjau tempalte.
Dan Klik Simpan template.
Untuk menghapus atau menghilangkan judul agar tidak ganda dengan judul yang ada di link gambar baru, silahkan ubah font color judul blog ( Header) menjadi transparent.
Misal Contoh kode font Header pada template yang menjadi percobaan adalah sebagai berikuti :
Header
----------------------------------------------- */
#header-wrap {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiimEFkLYRCWWYW3HSbKBpqDpKy6TlXxWkOovcyNKAcEDKAN_wpfm7TrX4hYd3HkPhbJZr5Aj9uI7oYfHlQDDqI9JmSyNZ3tMOBPGqa-NvIICr8Ka_o24fxIquh5YbVl1OfQlyq6risdro/s1600/Gambar+header11.jpg) no-repeat;
width:770px;
height:265px;
float:left;
}
#header-inner {
background-position:center center;
margin-left:auto;
margin-right:auto;
}
#header {
float:right;
width:500px;
color:transparent;
text-align:right;
padding:100px 20px 0 0;
}
#header h1 {
height:45px;
font:italic bold 30px georgia;
letter-spacing:0;
margin:0;
padding:10px 0px 0px 0px;
text-transform:none;
text-shadow: 2px 2px 2px color:transparent;
}
#header a {
color:transparent;
text-decoration:none;
text-shadow: 2px 2px 2px color:transparent;
}
#header a:hover {
color:transparent;
}
#header .description {
height:16px;
color:transparent;
font:bold 13px arial;
letter-spacing:0em;
margin:0;
padding:2px 0px 47px 0px;
text-transform:none;
text-shadow: 1px 1px 1px color:transparent;
}
#header img {
margin-left:auto;
margin-right:auto;
}
Ubah warna Font menjadi transparent, silahkan ubah sampai benar-benar judul tidak tampak lagi.
Cara Praktisnya adalah meletakan kode berikut diatas kode ]]></b:skin>
#header{
display: none !important;
}
mantab nih, thanks sob, tutorialnya membantu banget..
BalasHapushttp://obattpenyakit.com/obat-ambeien-herbal-terbaik/
thanks sobat atas tutorialnya
BalasHapusmantap dah tutornya kawan
BalasHapushttp://acemaxs31.com/obat-gagal-ginjal-herbal/
http://i-bikeco.com
http://mas-galih.com
terima kasih atas informasinya. Sukses ya..!! Dan Terimakasih banyak telah berbagi informasnya, Semoga Makin Keren selalu untuk info beserta websitenya,,
BalasHapusCek entry paling baru - Ganti Banner Situs
Terima kasih ilmunya Gan, saya newbe di blog...
BalasHapusterus semangat berbagi ya sob...
jangan lupa mampir di blog saya : http://arifforyou.blogspot.com/
terima kasih...
this is very help me..
BalasHapusThanks atas infonya gan :)
BalasHapustutorialnya mantap gan...
BalasHapusTerimakasih infonya sangat membantu :)
BalasHapushttp://bit.ly/1D9OQcV
terimakasih banyak sob, sangat membantu sekali..
BalasHapushttp://www.tokoobatku.com/obat-migrain-herbal/
terimakasih :)
BalasHapushttp://goo.gl/EB5TjK
Sip mas bro
BalasHapusinfonya bagus,,
BalasHapusdan sangat menarik...
Nice info!! Jazakallah
BalasHapusVisit me : http://ramucoretan.blogspot.com/
info bermanfaat makasih
BalasHapustnks bro infonya. kesusahan nih ak sebagai pemula. akhirnya ada yang membantu. tnks sob.
BalasHapuskunjungi juga yah http://supriyono55.blogspot.com
terima kasih gan untuk infonya
BalasHapusmain ya
kidut-theory.blogspot.com
Mampir gan ceritaceritakeren.blogspot.com
BalasHapusMantap infonya gan
BalasHapusMantap infonya gan
BalasHapusthanks guys, that's good!
BalasHapusthanks tutorialnya
BalasHapusblogalwinto.blogspot.com
Nice posting...
BalasHapuskunjungi blog saya http://fastudio28-jasa-arsitektur.blogspot.co.id/
Tksh
the discussion was very interesting to read, awaited the article more interesting yes .. Do not forget to visit the article about the health of the following:
BalasHapushttp://blogobattasik.com/cara-mengobati-kelenjar-getah-bening/
sukses terus gan
BalasHapushttp://jellygamatgoldg88.com/obat-tradisional-lupus/
thanks gan work juga akhirnya ..
BalasHapusjangan lupa kunjungan baliknya yaa di http://www.koraninformasi.com/
kalo di blog ane kok beda ya mungkin faktor template
BalasHapusmakasih ilmunya mas
farids13.blogspot.com
cara agar backgroundnya presisi dengan header gimana ya ? soalnya di blog saya ga presisi
BalasHapusartikelnya sangat bermanfaat, menarik, dan mudah dipahami oleh saya gan. makasih gan artikelnya jika butuh domain hosting termurah kunjungi www.jualdomainhostingmurah.com
BalasHapusmantap nih, mmakasih banyak terutama buat header transparant
BalasHapusIjin share ya :
http://salsabila-ravina.blogspot.co.id/2016/09/pencairan-jamsostek-melalui-website.html
http://poliskom.blogspot.co.id/2016/08/cara-merubah-ukuran-header-blogger.html --> cara merubah ukuran header blogger dengan menggunakan css paling gampang untuk pemula
BalasHapussilahkan di coba gan!
jos
BalasHapusinfonya sangat membantu gan,,
BalasHapustrimakasih buat agan,,