: :

Navbar Bawah

Kamis, 05 Januari 2012

Mengganti Background Blog dengan Gambar

Pingin buat template dengan loading yang cepat saya sarankan pakai warna template dengan kode html. Tapi setelah dilihat secara detail, kok kurang bagus ya kalau background tidak pakai gambar. Nah kali ini saya mau sedikit kasih tips buat kalian yang mau mengganti background blog dengan gambar pilihan kalian. Tapi sebelumnya kalian harus pandai-pandai dalam memilih gambar, karena kalau gambar tersebut mempunyai hak cipta tentu kalian akan terkena protes.
Oke, selanjutnya silahkan cari gambar yang mempunyai resolusi tinggi tapi ukurannya / size kecil.. hayoo bingung kan :mrgreen: . Resolusi tinggi itu biar gak pecah-pecah kalau dilihat di layar monitor yang lebar, dan size kecil itu biar tidak memberatkan loading blog kamu.
Berikut ini langkah-langkah cara mengatur background gambar berada pada tempatnya di blogspot.

Login ke blogger
Rancangan
Edit HTML
Disini kita mengambil contoh pada background body di tamplate blog kita, cari kode body {
Nah di sana terdapat kode background,
body{
background:#ded8c0;
color:#28261A;
font:12px verdana,arial,Sans-erif;
text-align:left;
margin:0;
line-height:1.6em;
}
Setiap blog rada berbeda sih Backgroundnya, nah untuk mengganti backborund misal dengan background / gambar ini
http://4.bp.blogspot.com/-dNS6cFsK2M4/TuwkW0K4RJI/AAAAAAAAAYk/hsaP92g98TI/s1600/wallpaper.jpg
Maka kalian cukup menambahkan url(http://4.bp.blogspot.com/-dNS6cFsK2M4/TuwkW0K4RJI/AAAAAAAAAYk/hsaP92g98TI/s1600/wallpaper.jpg) repeat-x; pada background tersebut.
Jadi :
body{
background:#ded8c0 url(http://4.bp.blogspot.com/-dNS6cFsK2M4/TuwkW0K4RJI/AAAAAAAAAYk/hsaP92g98TI/s1600/wallpaper.jpg) repeat-x;
color:#28261A;
font:12px verdana,arial,Sans-erif;
text-align:left;
margin:0;
line-height:1.6em;
}
Tips yang lain, Background kamu juga bisa tetap walaupun scroll mouse kamu gerakkan ke atas atau kebawah. Tinggal kamu ganti repeat-x; menjadi repeat-x top left fixed;
Atau yang paling saya suka adalah menggunakan gambar kecil namun bisa menjadi besar dan tetap. Yakni kamu cari dulu gambar kecil, setelah itu seperti biasa, tinggal kamu rubah repeat-x; menjadi repeat scroll 0 0;
Semoga bermanfaat deh :D

0   komentar

Cancel Reply