Background blog statis

Judul yang sederhana akhirnya sering membuat orang bingung. Untuk artikel ini anda tidak perlu bingung karena ketika anda menjelajahi blog ini sebenarnya anda sudah membuka blog dengan background yang bersifat statis. Background statis dapat dengan mudah dikenali ketika pengunjung mencoba menggulung halaman blog, dimana background/latarbelakang blog tidak ikut bergulung.

Cara membuat blog dengan background statis :

1. Login ke Blogger.
2. Halaman Dasbor (Dasboard).
3. Klik Rancangan (Design).
4. Klik Edit HTML.
5. Klik Download Template Lengkap (Download Full Template) » Proses Backup template.
6. Simpan file template di folder PC.
7. Cari kode syntax body.
8. Lakukan perubahan pada syntax body sesuai panduan di bawah.
9. Klik Simpan Template (Save Template).

Syntax body:

body {
       background:#xxxxxx;
       ... : .... ;
       ....: .... ;
       ....: .... ;
}

Catatan/Keterangan :

1. background: #xxxxxx; biasanya berupa KODE seperti :
   
   - background: #fff; --> fff merupakan KODE untuk warna background.
   - background: blue; --> blue adalah KODE warna background, atau
   - background: #fff url(http://......jpg/gif/png);
2. Ganti KODE background: #xxxxxx; di atas dengan KODE :
   
   • Apabila image yang digunakan berukuran sama dengan body (sekitar 1000x700 pixel) gunakan KODE:
     
     background: url(http://..............jpg/gif/png) top left no-repeat;
     background-attachment: fixed;
   • Apabila image yang hendak digunakan sebagai background body lebih kecil dari ukuran luas body, gunakan KODE:
     
     background: url(http://..............jpg/gif/png) top left no-repeat;
     background-attachment: fixed;
     background-size:1100px 700px;
3. Bentuk KODE pada body setelah perubahan kira-kira seperti :
   
   

   Syntax body:

   body {
          background: url(http://..............jpg/gif/png) top left no-repeat;
          background-attachment: fixed;
          ... : .... ;
          ....: .... ;
          ....: .... ;
   }

   
   
   atau seperti :
   
   

   Syntax body:

   body {
          background: url(http://..............jpg/gif/png) top left no-repeat;
          background-attachment: fixed;
          background-size:1100px auto;   /* atau 1100px 700px */     
          ... : .... ;
          ....: .... ;
          ....: .... ;
   }

   
   
   Jika image sangat kecil :
   
   

   Syntax body:

   body {
          background: url(http://..............jpg/gif/png);
          background-attachment: fixed;
          ... : .... ;
          ....: .... ;
          ....: .... ;
   }

4. KLIK Simpan Template.
5. Buka blog untuk melihat hasilnya.

Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :

Update » Selasa PON, January, 31, 2012

» Happy Blogging - gubhugreyot «