English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified

Monday, 29 April 2013

Cara Mengganti / Ubah Background Template Blogspot

Seorang blogger mungkin memiliki keinginan mengubah tampilan blognya. Salah satu cara adalah dengan mengganti/ ubah background / latar belakang blognya,
bisa jadi tujuannya agar blognya terlihat lebih hidup, lebih artistik ataupun dengan tujuan personalisasi dirinya. Satu hal yang terpenting adalah jangan sampai dengan background yang baru malah terlihat lebih "jelek" dari background terdahulu. bisa jadi pengunjung blog malah tidak betah berlama2 di blog Anda. Ataupun malah membuat loading blog Anda bertambah berat alias lelet, hehe. Oke langsung saja kita pada materi pembahasan ( weleh kaya Pak guru aje) :

  1. Login ke akun blogger Anda
  2. Klik Rancangan > Edit HTML> centang/klik Expand Template Widget  kemudian cari kode di bawah  ini:
   body {

          tekan Ctrl + F untuk memudahkan pencarian (lihat gbr), kotak pencarian di kiri bawah.


cara merubah background latar belakang blogspot


Sebagai contoh lihat penjelasan berikut.

body {
    margin:0 auto;
    padding:0px 0px 0px 0px;
    background:#F6F6F6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjmrg-BaY6Lp0ZyX0TCqS_H24UcrEmmdlnl0gODcmpkt5lxoleHDGIqlVwFvroxdD14l6O5HTbpXr0_9e-b2tL1a5VXjBUGA5AfFqaYXC2JWiO1Qp4HmfyzpztwBuwtxchfLQXMoC50Dl5/s0/body.png) top repeat-x ;
    font-family:verdana,Arial, Tahoma,Century gothic,  sans-serif;
    font-size:12px;
    }

Lihat kode background:#F6F6F6.  kode itu menunjukkan warna latar belakang, sedangkan kode url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjmrg-BaY6Lp0ZyX0TCqS_H24UcrEmmdlnl0gODcmpkt5lxoleHDGIqlVwFvroxdD14l6O5HTbpXr0_9e-b2tL1a5VXjBUGA5AfFqaYXC2JWiO1Qp4HmfyzpztwBuwtxchfLQXMoC50Dl5/s0/body.png) adalah alamat web tempat background gambar di simpan.
cari di : http://weheartit.com/
dll 
untuk menggantinya Anda bisa menghapus salah satunya, Jika Anda mengininkan dengan latar belakang warna saja, maka kode berwarna biru harus dihapus, sedangkan jika ingin berlatar belakang gambar (image), maka tidak perlu dihapus. Di blog saya tetap saya pasang agar jika background dalam bentuk gambar gagal diloading pengunjung blog, maka background dalam bentuk warna masih bisa. 


ukurannya cukup kecil (1,6kb) namun  memenuhi seluruh tampilan latar belakang blog. Lihat kode berwarna kuning (top repeat-x) hapus saja kode semacam itu, yaitu sesudah kode berwarna biru, (hati-hati tanda titik koma (;) jangan sampai terhapus). Sehingga kodenya menjadi seperti di bawah ini (lihat kode warna biru)

body {
    margin:0 auto;
    padding:0px 0px 0px 0px;
    background:#F6F6F6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjmrg-BaY6Lp0ZyX0TCqS_H24UcrEmmdlnl0gODcmpkt5lxoleHDGIqlVwFvroxdD14l6O5HTbpXr0_9e-b2tL1a5VXjBUGA5AfFqaYXC2JWiO1Qp4HmfyzpztwBuwtxchfLQXMoC50Dl5/s0/body.png);
    font-family:verdana,Arial, Tahoma,Century gothic,  sans-serif;
    font-size:12px;
    }

Bagaimana? sudah paham dan sudah diganti?

3. Jika sudah klik Pratinjau,  seandainya langkah2 Anda sudah benar, maka tidak akan ada error pada pratinjau.
4. Kalau sudah mantap klik Simpan Template.
5. Selesai dan selamat mencoba.

Semoga tutorial cara mengganti atau merubah background template blog ini bisa membantu sobat blogger yang lain.  

Jika sobat mau mengetahui kode warna blog silakan masuk ke tools kode warna 

atau

Membuat Background Gambar di Postingan Blog

Menampilkan Background gambar atau image background pada postingan blog akan membuat lebih menarik tampilan posting. Setelah artikel saya sebelumnya membuat bingkai tulisan di postingan, kali ini saya akan menjelaskan cara membuat background gambar pada tulisan yang akan kita posting. Untuk membuat latar belakang gambar posting, harus dilakukan pada bagian Edit HTML saat membuat postingan karena di sana akan ditambahkan beberapa kode latar belakang (image background).

Membuat backgroud gambar pada postingan

Seperti pada tutorial blog yang lain langkah pertama ya mesti login ke account blogger dulu. Kemudian masuk ke posting, pilih new post dan pilih Edit HTML. Berikut ini adalah kalimat yang akan diberi latar belakang gambar:

Saya secara pribadi memperbolehkankan blog saya ini dikopi paste atau disalin ke blog teman-teman yang lain. Nggak mencantumkan link sumbernya juga nggak pa-pa. Saya nggak bakal lapor ke Bos Google (serius),  tapi saya nggak bisa tanggung akibat yang lain (kreativitas teman-teman sendiri nanti yang akan tidak berkembang). Saya sendiri pun nggak yakin sama blog saya ini blog spam atau bukan. Bisa jadi besok saya udah nggak bisa posting lagi karena udah kena banned sama Bos Google karena tulisannya nggak karuan atau dilaporkan sama orang lain.
Kalau sudah, di bawah ini contoh kode untuk membuat background gambar :

<div style="background:url(image url address) no-repeat;">
Di sini Anda dapat ketik kalimat yang akan dibuat. Contohnya sudah saya siapkan di atas. Tutup posting dengan kode berikut
</div>

Kemudian ganti image url address dengan alamat gambar yang sudah disiapkan. Kalau saya biasa hosting image di blogger atau pakai photobucket image hosting Tergantung situasi dan kondisi bandwidth. Misalnya saya mengambil image url address untuk contoh di bawah adalah seperti ini:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJHA0W6RxMonRMJB3E3yGoZ_Q2Ol7rseCFuSBRAtGvWSyjPGeNJWvpumZDLpxqHIwQXQKB9R7Vc3Wzy-LHQGB4ilBXWmFVNFwZwjG32TaMePIaOTzT3naNAJANnwMbOCGaF1QMjCAnku4/s1600/mirror+maskolis.jpg
Sehingga secara lengkap penulisan kode background dan kalimat di posting menjadi seperti di bawah ini:

<div style="background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJHA0W6RxMonRMJB3E3yGoZ_Q2Ol7rseCFuSBRAtGvWSyjPGeNJWvpumZDLpxqHIwQXQKB9R7Vc3Wzy-LHQGB4ilBXWmFVNFwZwjG32TaMePIaOTzT3naNAJANnwMbOCGaF1QMjCAnku4/s1600/mirror+maskolis.jpg) no-repeat;">
Saya secara pribadi memperbolehkankan blog saya ini dikopi paste atau disalin ke blog teman-teman yang lain. Nggak mencantumkan link sumbernya juga nggak pa-pa. Saya nggak bakal lapor ke Bos Google (serius),  tapi saya nggak bisa tanggung akibat yang lain (kreativitas teman-teman sendiri nanti yang akan tidak berkembang). Saya sendiri pun nggak yakin sama blog saya ini blog spam atau bukan. Bisa jadi besok saya udah nggak bisa posting lagi karena udah kena banned sama Bos Google karena tulisannya nggak karuan atau dilaporkan sama orang lain.
</div>
Dan ini adalah hasil lengkap posting dengan image backgroud:


Saya secara pribadi memperbolehkankan blog saya ini dikopi paste atau disalin ke blog teman-teman yang lain. Nggak mencantumkan link sumbernya juga nggak pa-pa. Saya nggak bakal lapor ke Bos Google (serius), tapi saya nggak bisa tanggung akibat yang lain (kreativitas teman-teman sendiri nanti yang akan tidak berkembang). Saya sendiri pun nggak yakin sama blog saya ini blog spam atau bukan. Bisa jadi besok saya udah nggak bisa posting lagi karena udah kena banned sama Bos Google karena tulisannya nggak karuan atau dilaporkan sama orang lain.
 

0 comments:

Artikel lainnya