3 Cara Mengganti Background Blog di HTML

3 Cara Mengganti Background Blog di HTML

Diposting pada

Mang Otep – Anda ingin merubah background blogger dengan foto (Gambar) atau warna favorit ? Ada beberapa Cara untuk Mengganti Background Blog anda dengan mudah dan cepat. Mang Otep akan menjelaskan 3 cara simpel tersebut agar blog anda menjadi lebih keren dan bervariatif.

Background blog sendiri adalah layout bagian luar sebuah template yang biasanya terletak di posisi paling akhir dalam urutan tampilan blog. Mengganti Backgroud tidak akan berdampak buruk pada tampilan artikel anda yang notabene sudah di setting tidak transparan (Kecuali template tertentu ada juga yang latar artikel transparan).

Cara Mengganti Background Blog

Pada kesempatan kali ini saya akan memberikan beberapa pilihan cara yang bisa anda lakukan dalam merubah atau mengganti background blog anda.

Anda dapat memilih cara mana yang bisa di gunakan pada template blog anda, karena setiap kode template pasti berbeda. Langsung saja untuk tutorial 3 Cara Mengganti Background Blog adalah sebagai berikut:

Mengganti Background dengan Perancangan Template

Bisa di katakan cara yang pertama ini sangatlah mudah dan cocok untuk pemula. Cara ini memanfaatkan fitur perancangan template pada dashboard blogger atau blogspot anda.

Cara ini akan berjalan dengan baik jika anda memakai template bukan hasil download atau bisa di bilang template dari blogger asli. Langkah-langkah yang perlu anda lakukan adalah sebagai berikut:

1. Masuk ke dalam akun Blogger anda.

2. Pergi ke Menu Tema lalu pada jendela tema anda pilih Sesuaikan

Cara Mengganti Background Blog template

3. Anda akan di bawa ke jendela pengaturan perancangan template. Kemudian Pilih Latar Belakang.

4. Terdapat menu Gambar Latar dan juga Tema Warna Utama

Cara Mengganti Background Blog template

5. Tentukan gambar latar ataupun Tema Warna Utama anda, lalu pilih Terapkan ke Blog

Notes: Karena mang otep tidak memakai template bawaan blogger alhasil gambar di atas tidak berfungsi baik. Maka bagi yang menemukan problem ini, anda bisa gunakan cara selanjutnya.

Mengganti Warna Background Blog dengan CSS

Seperti yang sudah mang otep jelaskan, jika cara pertama anda tidak berhasil maka selanjutnya eksekusi dengan menggunakan Editor HTML template anda. Caranya pun sangat mudah, yang perlu anda lakukan adalah:

1. Dari Tab Tema anda pilih Edit HTML

2. Cari kode body{ di bagian HTML anda, untuk memudahkan bisa gunakan CTRL+F

Cara Mengganti Background Blog edit HTML

3. Setelah ketemu kode yang di maksud anda dapat merubah nya dengan warna yang anda inginkan. Contohnya seperti ini:

Cara Mengganti Background Blog edit HTML

4. Ubahlah kode background: #f1f1f1 (CONTOH) menjadi kode background: #000000 (CONTOH). Sesuaikan pada template kalian

Untuk pilihan warna di HTML anda harus menggunakan Kode Warna CSS. KLIK DISINI untuk mengetahui warna yang lengkap.

5. Jika sudah selesai pilih Simpan Tema.

Mengganti Background Blog dengan Gambar atau Foto

Cara terakhir adalah pengembangan dari cara kedua, yaitu menambahkan gambar di kode CSS yang sudah anda dapatkan dan ubah di cara nomor 2 di atas. Sebelumnya CSS CONTOH saya adalah seperti ini:

body{line-height: normal;font: 13px ‘Open Sans’,sans-serif !important;background: #f1f1f1;}

dan saya rubah menjadi ini:

body{line-height: normal;font: 13px ‘Open Sans’,sans-serif !important;background: #000000;}

Setelah sudah sampai pada tahap itu, kemudian anda ingin memasukkan gambar menarik untuk background anda, anda hanya perlu menambahkan alamat url gambar tersebut. Maka CSS tadi akan menjadi seperti ini:

body{line-height: normal;font: 13px ‘Open Sans’,sans-serif !important;background: #f1f1f1 url(Alamat URL Gambar) fixed no-repeat}

Penjelasan kode CSS

  • Fixed : digunakan agar gambar anda tidak ikut naik turun sesuai scroll layar. Anda bisa hapus opsi ini.
  • no-repeat : digunakan agar gambar tidak terjadi pengulangan dari sisi manapun.
  • CSS no-repeat bisa diganti repeat-x untuk pengulangan gambar hanya pada sumbu X dan repeat-y untuk pengulangan gambar hanya pada sumbu Y

Penutup

Dengan 3 Cara Mengganti Background Blog saya yakin anda sudah dapat mengubah tampilan latar belakang blog anda sekarang. Jika masih belum berhasil anda boleh bertanya di kolom komentar atau bisa meminta bantuan langsung ke Mang Otep melalui E-email seplintir@gmail.com atau melalui halaman Kontak Saya di Blog ini.

Jika menyukai artikel ini anda bisa langsung subscribe Blog Mang Otep untuk mendapatkan informasi terbaru lainnya. Jangan lupa untuk share ke sosial media anda juga ya. Terima Kasih.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *