CARA MEMBUAT KOLOM SIDEBAR TERPISAH |informasi apa saja

Selasa, 08 Juni 2010

CARA MEMBUAT KOLOM SIDEBAR TERPISAH

6/08/2010 07:24:00 AM |

Diposting oleh Unknown |

Edit Entri

Kolom sidebar yang terpisah akan membuat tampilan blok menjadi lebih menarik dan rapi.

cara pembuatan sidebar yang terpisah ini tidak sulit dilakukan, anda hanya perlu merubah scrip yang ada pada template blog anda melalui edit html.

untuk membuat sidebar terpisah, ikuti langkah – langkah dibawah ini.

1. Buka blogger dengan ID sobat.

2. Klik Tata Letak --> Edit HTML.

3. Contreng Expand Template Widget.

4. Lalu cari kode yang seperti ini :

      .sidebar .widget, .main .widget {
      margin:0 0 1.5em;
      padding:0 0 1.5em;
      }

5. Pisahkan saja sehingga menjadi seperti ini :

      .sidebar .widget {
      margin:0 0 1.5em;
      padding:0 0 1.5em;
      }

      .main .widget {
      margin:0 0 1.5em;
      padding:0 0 1.5em;
      }

6. Untuk sidebar terpisah sobat rubah menjadi seperti berikut :

      .sidebar .widget {
      background:#FFFFFF;
      border:1px solid #CCCCCC;
      margin:0 0 1.5em;
      padding:0.5em;
      }

Buat bagian main. widget atau kolom postingan tinggal sobat kreasikan sendiri, untuk background #FFFFFF adalah warna background putih dan border:1px solid #CCCCCC untuk border warna abu - abu. Kode warna bisa sobat lihat disini. Sedangkan untuk padding adalah jarak antara postingan dengan border, bisa juga sobat merubahnya menjadi padding:15px; agar lebih terlihat rapi antara postingan dengan border tidak terlalu rapat. Untuk kotak sidebar agar membentuk garis melengkung pada sudutnya sobat bisa tambahkan kode sehingga menjadi seperti berikut ini :

.sidebar .widget {
background:#FFFFFF;
border:1px solid #CCCCCC;
margin:0 0 1.5em;
padding:15px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
}

earning-news.blogspot.com