SIDEBAR TAMPIL DALAM BENTUK KOTAK-KOTAK

Coba anda perhatikan sidebar EPG Studio, terlihat dalam bentuk kotak-kotak yang
terpisah. Fungsinya hanya untuk penampilan agar telihat lebih rapih dan tentunya
akan mempercantik penampilan blog.

Cara membuatnya tidak terlalu sulit, anda hanya perlu mengotak-atik kode-kode
HTML pada blog anda.

Kalau anda ingin melanjutkan cara membuatnya, ikuti langkah-langkah berikut ini
:

Jangan lupa sebelum anda melakukan perubahan pada kode-kode HTML, Backup
Template terlebih dahulu dengan cara Download Template Lengkap dan simpan pada
komputer anda. Ini kita lakukan untuk menjaga agar jika anda tidak berhasil
dalam melakukan pengeditan dapat mengembalikan kepada keadaan semula.

1. 
   
   Cari kode seperti di bawah ini :
   
   
   
   .sidebar .widget, .main .widget {

border-bottom:1px dotted $bordercolor;

margin:0 0 1.5em;

padding:0 0 1.5em;

}
   
   
   
    
2. Dari kode widget diatas menunjukan bahwa sidebar widget (halaman
   sidebar) dan main widget (halaman postingan) memiliki penampilan yang sama.
   
   Jadi agar terlihat dalam bentuk kotak kotak, anda harus memisahkan kedua
   kode widget tersebut menjadi seperti di bawah ini : (anda dapat mengcopy
   kode dibawah ini)
   
   
   
   .sidebar .widget{

border-bottom:1px dotted $bordercolor;

margin:0 0 1.5em;

padding:0 0 1.5em;

}





.main .widget {

border-bottom:1px dotted $bordercolor;

margin:0 0 1.5em;

padding:0 0 1.5em;

}
   
   
   
    
3. Sekarang anda fokuskan pada kode sidebar.
   
   Agar penampilannya terpisah dalam bentuk kotak-kotak, anda harus
   memvariasikan kode-kodenya seperti contoh dibawah ini :
   
   
   
   

.sidebar .widget{



background:#0000b3;

border:1px dotted #C3D9FF;

margin:0 0 1.5em;

padding:0.5em;

}
   
   
   
   Kode diatas mengandung arti :latar belakang sidebar berwarna biru tua,
   border lebarnya 1 px dengan warna biru muda (lebar border inilah yang
   membuat sidebar terlihat dalam bentuk kotak-kotak), jarak antara widget
   sebesar 1.5em dan padding 0.5em.
   
   Kode tersebut dapat anda ubah sesuai dengan keinginan dan kreatifitas anda.
   
   
    
4. Lakukan hal yang sama untuk mengubah penampilan main widget. Pilih
   variasi warna yang cocok agar penampilan semakin cantik.
   
    
5. Selesai...!!!

Admin

Endro Prasiswo
tel.:081334169022
fax:03423326622
Email:admin@kesamben.co.cc
URL:http://www.obralilmu.co.cc
Facebook:http://www.facebook.com/endro.prasiswo

Silahkan dibaca juga kelanjutannya dibawah ini