Cara Membuat Sidebar Kiri Dan Kanan

Langsung saja deh kita menuju pada judul di atas Cara Membuat Sidebar Kiri Dan Kanan.

Langkah pertama yang harus kita lakukan adalah :

Login Blogger

Pilih Rancangan

Edit HTML, pastikan backup template kamu

Beri tanda Centang pada Expand Widget Template

Setelah langkah diatas kita lalui, carilah kode berikut :

#sidebar-wrapper {
width: 215px;
float: right;
padding: 5px;
border:1px solid $bordercolor;
background-color:#transparent;
background-image:url(none);

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Untuk lebih mudahnya, pencarian gunakanlah ctrl + F ketik #sidebar-wrapper {

Setelah ketemu tambahkan kode berikut di bawah kode tersebut di atas

#sidebarbaru-wrapper {
width: 215px;
float: left;
padding:5px;
border:1px solid $bordercolor;
background-color:#transparent;
word-wrap: break-word;
overflow: hidden;
}

Beginilah kira-kira

#sidebar-wrapper {
width: 215px;
float: right;
padding: 5px;
border:1px solid $bordercolor;
background-color:#transparent;
background-image:url(none);

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebarbaru-wrapper {
width: 215px;
float: left;
padding:5px;
border:1px solid $bordercolor;
background-color:#transparent;
word-wrap: break-word;
overflow: hidden;
}

Sekarang kita menuju ke bagian bawah, carilah kode berikut :

<div id='main-wrapper'>

Tambahkan kode berikut tepat di atas kode tersebut

<div id='sidebarbaru-wrapper'>
<b:section class='sidebar' id='sidebarbaru' preferred='yes'/>
</div>

Sehingga menjadi seperti ini

Langkah terakhir kamu tinggal Simpan Template kamu dan lihat hasilnya.

Semoga Bermanfaat

Agung Widagdo

Pages

Cara Membuat Sidebar Kiri Dan Kanan

Baca Juga :

Infolinks