Memperindah blog ternyata juga merupakan hal yang
menyenangkan, karena kustomisasi blog memang sangat diperlukan agar blog tampak
lebih personal dan unik. Nah salah satu cara membuat blog tampak beda dengan
yang lain adalah dengan mengubah background blog. Untuk mengganti gambar
background blog seperti yang diinginkan, berikut langkah-langkahnya:
(Sebelum anda mengganti warna/gambar background dengan
gambar bakcground baru, pastkan 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,
lalu tekan Ctrl+F
4. Cari kode CSS ini: body{ dengan cara memasukkannya ke
dalam kotak pencarian dan tekan enter.
Atau bisa juga
dengan mencari kode selengkapnya/menambahkan kode setelah 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 adalah ukuran gambar anda, usahakan
untuk tidak menggunakan gambar dengan byte yang besar, usahakan di bawah 50 Kb, agar tidak membuat loading berat
dan lama.
Gambar memiliki ukuran pixel yang berbeda-beda. Pastikan
hasil gambar background blog anda penuh dari kiri ke kanan dan dari atas ke
bawah. Untuk membuat gambar background penuh diperlukan pengulangan. Gunakan
tag repeat (mengulang) ke kanan/samping: repeat-x, dan ke bawah: repeat-y.
Berikut contoh 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 hingga ke bawah (hingga footer
halaman), tambahkan repeat-y tepat 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 kode 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
Yap, sekian trik simpel mengenai cara mengganti
background blog.
Tidak ada komentar:
Posting Komentar