Selasa, 27 September 2016

Cara Mengganti Background Header Blog melalui edit HTML merupakan bagian pertama yang dilihat oleh pengunjung blog anda, jadi hal ini bisa dijadikan ukuran apakah blog anda menarik, kurang menarik atau bahkan tidak menarik sama sekali. Namun Background blog tidaklah harus berupa gambar tapi bisa juga hanya polos Bagai mana sesuka si pembuat blog itu sendiri ok langsung saja ke
Langkah-langkah Mengganti Background Header:


1.Login dulu ke akun blogger anda
2. Masuk ke manu tempalate. Untuk menghindari kesalahan dalam meng-edit template sebaiknya anda backup dulu template anda. Cara nya dengan meng-klik cadangkan/pulihkan >> klik unduh template lengkap.
3.Klik Edit HTML / lalu klik  ctrl + F untuk mencari kode
Silahkan cari kode  #header-wrapper  jika tidak di temukan Cari kode [  header  ]  atau seperti
background-image: url('images/header.jpg');      ganti url images/header nya

Atau mirip seperti di bawah ini, silahkan anda ganti kode #header-wrapper / atau hider dengan kode dibawah ini.

#header-wrapper{width:980px; height:196px; text-align:left; background:#272727 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRGyubvYePuOgF3BS0FsBGvNzJDqME__waAZNRlAF_6mG5kAOKU9opRRHTfklt0YQNMjA7BmpWxBhYpWrdYHuqh3oPnUvp23Dc3oRGsC9kU3x9HkW1WoTlOXLUDEKGcBquFZ5Y_GJ4g814/w140-h18-p/baner.jpg') repeat-x; padding:0px}

Lihat contoh gambar Sebelum di ganti url gambar hidernya

Lihat Contoh gambar Sesudah di tambah url gambar hider

Akan saya jelaskan lebih lengkap mengenai kode diatas..

1 .width:980px adalah lebar gambar blog anda, bisa anda ganti sesuai selera dan ukuran header blog anda.height:196px adalah tinggi gambar blog anda, ini bisa anda ganti juga sesuai selera.
2 .text-align:left adalah letak teks pada header blog anda, bisa anda ganti dengan text-align:right jika ingin teks berada di kanan, dan bisa anda ganti dengan text-align:centre jika ingin teks berada di tengah.
3 . url(...) adalah url gambar anda, bisa anda ganti dengan url gambar yang lain.
4 . repeat-x bisa anda ganti dengan no-repeat, jika tidak ingin ada pengulangan. Anda juga bisa mengganti dengan kode yang lain.
5 .padding:0px merupakan jarak kolom background juga bisa anda ganti sesuai selera.
 Setelah kode sudah tersusun dengan benar, anda bisa menyimpan template anda, dan silahkan lihat hasilnya.

Cukup disini mungkin penjelasan yang saya berikan kepada sobat semua semoga ini menjadi ilmu yang bermanfaat bagi sesama... :)

2 komentar:

  1. sangat bermanfaat sekali .tutorial ini .kan di blog lain biasanya cara menggantinya di template bawaan blog .keren keren ..lanjutkan ..........

    BalasHapus
    Balasan
    1. iya makasih .cara ini mungkin bisa di terapkan di template yang dari sini.makasih sudah berkunjung

      Hapus

Cari Di Blog Ini

Postingan Populer

Entri yang Diunggulkan

Cara Pasang Menu Drop Down Edit HTML.CSS

Drop down Menu multi lepel ini perlu di edit .di lihat dulu Caranya dan Bentuknya atau modelnya Caranya download dahulu dropdownnya / ...