Cara Merubah Posisi Sidebar dan Mainbar

Cara Merubah Posisi Sidebar dan Mainbar. Halo sahabat blogger....kali ini saya ingin berbagi trik mudah bahkan sangat sederhana, yang saya temukan hasil dari otak-atik CSS template saya saat mencoba mendesain template baru. Yaitu cara merubah posisi sidebar dan main (kolom utama tempat postingan) pada template blogger tetapi sebelum saya menerangkan ini, saya menyarankan agar sobat membaca tutorial yang ini terlebih dahulu, sebagai contoh tampilan elemen halaman template default minima seperti image berikut: 

Dari gambar diatas kita bisa melihat posisi sidebar berada disebelah kanan, sedangkan kolom utama disebelah kiri. Untuk merubah posisi sidebar dan main menjadi sebaliknya seperti gambar dibawah ini,

Mudah saja silahkan ikuti tutorial berikut:

• Pada dasbor --> Rancangan --> Edit HTML

• Jangan lupa centang Expand Template Widget

• Cari kode berikut:

#main-wrapper {

width: 410px;

float: left;

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 */

}

#sidebar-wrapper {

width: 220px;

float: right;

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 */

}

• Yang perlu diperhatikan hanya tulisan yang berwarna merah, silahkan ganti dengan kode berikut:

#main-wrapper {

width: 410px;

float: right;

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 */

}

#sidebar-wrapper {

width: 220px;

float: left;

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 */

}

• Simpan template dan Silahkan lihat hasilnya pada bagian elemen halaman.

sangat mudah sekali. tetapi kalau ada dari kalian yang masih bingung silahkan command langsung.