navibar

Selamat Datang Di Blog Sederhana Ini, Semoga Bermanfaat !!!

Minggu, 01 Agustus 2010

Tips n Trick Nyentrik "Cara Membuat Gambar Background pada Blog"



Tampilan blog yang standar / minima tentunya sudah menjadi hal yang biasa atau kalau boleh dikatakan tidak menarik.Untuk itu, kita perlu memvariasi tampilan pada blog kita agar lebih cantik dan menarik. Para browser/blogger tidak hanya mencari materi blog saja melainkan juga tampilan blog. Jadi tampian blog harus diperhatikan agar menarik pengunjung.


Di bawah ini akan saya berikan tips "Cara Membuat Background pada Blog". ya....,,, kita bisa membuat background dengan gambar sesuai dengan keinginan kita, sesuai selera kita sehingga tampilan blog menjadi lebih menarik.

syaratnya ialah anda harus mempunyai gambar yang akan dijadikan background. silahkan browsing dan cari gambar mana yang akan dijadikan sebagai background, jangan lupa catat/salin alamat gambar.


Nah,,,,

langkah selanjutnya memasang gambar tersebut ke dalam blog, tanpa basa-basi lagi ikuti saja langkah-langkah berikut:



1. Sebelum memulai, silahkan Copy/download terlebih dahulu template yang Anda miliki agar kalau terjadi kesalahan bisa dikembalikan seperti semula.

2. Copy kode di bawah ini, lalu edit dengan menggunakan wordpad, notepad atau document txt.


background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZ7a70XfoKYrFlbx9kzIPd0Rvjqhht6wVWvRfQ_QghTyLPinJbWUjUq41iTYXpem4FjGcXD8Q_UhnWGMw0WmKAdrxshjCZFwi2TV0bG_uUPLKhSD_qailt3DUxypN6-FKcBW7SDN4yMSk/');background-color:transparent;

background-attachment: fixed;

background-position:top left;

background-repeat:no-repeat;


Ganti url gambar yang berwarna merah dengan url gambarmu.

kode top left yang berwarna biru bisa kamu ganti dengan top right, bottom left, bottom right, left, center atau right. Sesuaikan dengan besarnya gambarmu. Bila menggunakan gambar berukuran besar ganti saja dengan center.

Kode no-repeat yang berwarna orange adalah kode yang menyatakan bahwa gambar yang kamu pasang tidak memerlukan pengulangan, Nah, kalau memakai gambar berukuran kecil semisal gambar texture, hapus saja kode no-repeat tersebut.


3. Login ke blogger --> Klik Customize --> Layout --> Edit html. Cari kode seperti di bawah ini :


body {

background:$bgcolor;

margin:0;

color:$textcolor;

font:x-small Georgia Serif;

font-size/* */:/**/small;

font-size: /**/small;

text-align: center;

}



Gunakan modus pencarian ( Ctrl + F ) untuk lebih memudahkan dalam mencari kode tersebut.


4. Rubah kode di atas dengan menambahkan kode hasil editan kamu tadi sehingga hasilnya menjadi seperti di bawah ini : Perhatikan baik-baik penempatan kode hasil editan yang berwarna biru.


body {

background:$bgcolor;

background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZ7a70XfoKYrFlbx9kzIPd0Rvjqhht6wVWvRfQ_QghTyLPinJbWUjUq41iTYXpem4FjGcXD8Q_UhnWGMw0WmKAdrxshjCZFwi2TV0bG_uUPLKhSD_qailt3DUxypN6-FKcBW7SDN4yMSk/');

background-color:transparent;

background-attachment: fixed;

background-position:top left;

background-repeat:no-repeat;

margin:0;

color:$textcolor;

font:x-small Georgia Serif;

font-size/* */:/**/small;

font-size: /**/small;

text-align: center;

}


5. Pratinjau terlebih dahulu, jika semua beres, Simpan hasil pekerjaanmu dengan mengklik tombol SAVE TEMPLATE.


Nah,,,

sekarang blog kita jadi lebih menarik bukan, dengan tambahan backgroud di belakangnya

OK,,, demikianlah Tips n Trick Nyentrik dari saya