Sudah berlangganan artikel blog ini via RSS Feed?

Senin, 28 Februari 2011

Cara Mengganti Background Pada Blog

Nah,, kali ini ane ingin mengubah background pada blog ane,, pastinya biar lebih keren donk,,,
langsung aja deh GPL (Ga Pake Lama ) hehehe..

  • Mengganti Warna Background
  • Untuk template minima klasik :

    1. Sign in
    2. Klik menu Template
    3. Klik menu Edit HTML
    4. Copy seluruh kede Template, paste pada notepad lalu save untuk backup data
    5. Rubahlah kode warna asli template dengan kode warna yang sobat sukai (yang warna merah adalah kode yang harus di rubah) :

    6. body {
      background:#fff;
      margin:0;
      padding:40px 20px;
      font:x-small Georgia,Serif;
      text-align:center;
      color:#333;
      font-size/* */:/**/small;
      font-size: /**/small;
      }

      Misalkan jika ingin menjadi warna abu-abu terang, kodenya jadi seperti ini :

      body {
      background:#E7E3E3;
      margin:0;
      padding:40px 20px;
      font:x-small Georgia,Serif;
      text-align:center;
      color:#333;
      font-size/* */:/**/small;
      font-size: /**/small;
      }

    7. Klik tombol Pratinjau untuk melihat perubahan
    8. Jika sudah OK, klik tombol Simpan Perubahan Template
    9. Selesai.


  • Mengganti Background Dengan Image

  • Sebelumnya kita harus membuat/mempunyai gambarnya terlebih dahulu,,
    alamat gambarnya adalah :

    http://amen24.googlepages.com/pattern_096.gif

    gambarnya seperti ini :



    gambarnya sangat kecil bukan? tapi gambar tersebut akan tampil memenuhi layar karena akan di tampilkan dalam jumlah yang sangat banyak.
    Untuk cara instalasinya, silahkan ikuti langkah-langkah berikut !
    Untuk template minima klasik :

    1. Sign in
    2. Klik menu Template
    3. Klik menu Edit HTML
    4. Copy seluruh kede Template, paste pada notepad lalu save untuk backup data
    5. Tambahkan kode berikut pada style sheet css sobat (yang warna merah adalah kode yang harus di tambahkan) :

    6. body {
      background:#fff url('http://amen24.googlepages.com/pattern_096.gif');
      margin:0;
      padding:40px 20px;
      font:x-small Georgia,Serif;
      text-align:center;
      color:#333;
      font-size/* */:/**/small;
      font-size: /**/small;
      }

    7. Klik tombol Pratinjau untuk melihat perubahan
    8. Jika sudah OK, klik tombol Simpan Perubahan Template
    9. Selesai.
    Kode warna background sengaja tidak saya hilangkan, ini di maksudkan agar apabila background image yang kita pakai gagal di loading oleh komputer pengunjung blog, maka yang bekerja duluan warna background.

    Untuk template minima baru :

    1. Sign in
    2. Klik menu Layout
    3. Klik menu Edit HTML
    4. Klik tulisan Download Template Lengkap, silahkan save dulu template sobat untuk backup data
    5. Klik kotak kecil di samping tulisan Expand Template Widget
    6. Tunggu beberapa saat sampai proses selesai
    7. Tambahkan kode berikut pada style sheet css sobat (yang warna merah adalah kode yang harus di tambahkan) :

    8. body {
      background:$bgcolor url('http://amen24.googlepages.com/pattern_096.gif');
      margin:0;
      color:$textcolor;
      font:x-small Georgia Serif;
      font-size/* */:/**/small;
      font-size: /**/small;
      text-align: center;
      }

    9. Klik tombol Pratinjau untuk melihat perubahan
    10. Bila sudah OK, klik tombol SIMPAN TEMPLATE
    11. Selesai.
    Selamat mencoba,,, ^_^

    1 komentar:

    Dunia Berkarya mengatakan...

    wah keren bos infonya nanti saya mau coba, terimakaish ya. salam sahabat

    Posting Komentar

     

    INFO SITE

    Powered by  MyPagerank.Net Yahoo bot last visit powered by MyPagerank.Net

    SEO TOOLS

    BANNER ANE

    Photobucket
    Silahkan copy kode HTMLnya..
    <a href="http://webmantab.blogspot.com" target="_blank"><img src="http://i939.photobucket.com/albums/ad236/hanzputro/webmantabbanner.gif" border="0" alt="Photobucket" /></a>

    MY FRIEND