Skip to main content

Cara Mengganti Background Blog

Cara mengganti background blog ,bagi teman sobat blogger yang ingin mengubah tampilan background blog nya mungkin goresan pena ini sedikit dapat membantu. Untuk mengganti gambar background blog ibarat yang diinginkan, berikut langkah-langkahnya:

Sebelum mengubah,pastikan  telah menemukan/memiliki gambar background dan menghosting-nya sendiri.

1. Masuk ke dashboard > Template
2. Klik Edit HTML
3. Arahkan dan klik kursor di dalam area template editor, kemudian tekan Ctrl+F
4. Cari arahan CSS ini: body{ dengan cara memasukkannya ke dalam kotak pencarian dan tekan enter.
Atau dapat juga dengan mencari arahan selengkapnya/menambahkan arahan sehabis body {seperti berikut:
body{background-image: url(alamat url gambar anda);
5. Ganti alamat url gambar anda dengan alamat gambar background yang telah anda host.
6. Save template

Yang perlu diperhatikan yaitu ukuran gambar anda, usahakan untuk tidak memakai gambar dengan byte yang besar, usahakan di  bawah 50 Kb, biar tidak menciptakan loading berat dan lama.
Gambar mempunyai ukuran pixel yang berbeda-beda. Pastikan hasil gambar background blog anda penuh dari kiri ke kanan dan dari atas ke bawah. Untuk menciptakan gambar background penuh diharapkan pengulangan. Gunakan tag repeat (mengulang) ke kanan/samping: repeat-x, dan ke bawah: repeat-y. Berikut pola untuk pengulangan ke kanan/samping::


body{background:url(http://2.bp.blogspot.com/_wnULV7UHiXY/TSOhgPOpqXI/AAAAAAAAAH8/dC7uwZp1HA0/s1600/t28_blue_background.jpg
);background-position:top left;background-repeat: repeat-x; ....dst}


agar gambar juga mengisi sampai ke bawah (hingga footer halaman), tambahkan repeat-ytepat disamping repeat-x. Contoh:
body{background:url(http://2.bp.blogspot.com/_wnULV7UHiXY/TSOhgPOpqXI/AAAAAAAAAH8/dC7uwZp1HA0/s1600/t28_blue_background.jpg
);background-position:top left;background-repeat: repeat-x repeat-y; ....dst}


Jika anda tidak ingin gambar anda berulang baik ke kiri atau ke bawah, cukup gunakan arahan no-repeat. Contoh:

body{background:url(http://2.bp.blogspot.com/_wnULV7UHiXY/TSOhgPOpqXI/AAAAAAAAAH8/dC7uwZp1HA0/s1600/t28_blue_background.jpg
);background-position:top left;background-repeat: ; ....dst



Oke mungkin itu saja semoga goresan pena ini bermanfaat . .,

Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar