Cara Membuat Full Background Di Blogspot



Dulu saya sering tepikir susahnya jika  memasukan sebuah image/gambar untuk dijadikan full background buat blog kerana saya harus merubah ukurannya terlebih terlebih dahulu agar sesuai dengan ukuran template yang digunakan, tapi Alhamdulillah setelah berumpa dengan CSS3 seperti itu tidak saya tidak perlu risau lagi (hehe).Caranya sangat mudah, kita tinggal memasukan kod tambahan dalam akhiran CSS yang berisi url background gambar yang akan ditampilkan. Untuk lebih jelasnya mari kita langsung praktekan saja.

Login ke akun blogger dan pilih menu Template kemudian pilih Edit HTML, cari tulisan yang ber headline oren seperti dibawah ini dalam template kamu ( gunakan CTR+F untuk memudahkan pencarian)

remove yang telah ditanda dibawah,


body {
color: #000000;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9Z1kEH52BnHuoibfSuepc1rQ1d615t4jKJf38mjgrqyL9cQdR9ejwEF9BZhpUrvLCpg7_Wo-6ZMmqASyDlwIemAfSVACWKlf4ECenmVqGvFYuECvQRBXGoZXjM2zve333pwZXY-qtVD0/s1600/body.jpg) ;
font: 12px/18px Verdana, Helvetica, sans-serif;
}


Kode tersebut adalah CSS template kamu , jika sudah dapat kamu harus menghapus sisa kodnya sampai sebelum kurungan tutupnya nantinya akan tersisa seperti ini body{color: #000000;background: font: 12px/18px Verdana, Helvetica, sans-serif}

copy kode dibawah ini


url(URL GAMBAR KAMU)no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;


Sisipkan kode yang dicopy tadi ke dalam CSS yang baru saja kamu hapus tadi, tepatnya setelah tanda titik dua, nantinya akan jadi seperti ini



body{color: #000000;background: url(URL GAMBAR KAMU) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; ; font: 12px/18px Verdana, Helvetica, sans-serif}



Silakan save. Nah selesai sudah tahapnnya sekarang blog kamu sudah memiliki background full yang sempurna...


1 Ulasan

Terbaru Lebih lama