Login ke Blogspot –> Tata Letak –> Edit HTML
Cari baris kode main-wrapper dan sidebar-wrapper
#main-wrapper {
width: 410px;
float: $startSide; 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 */
text-align:justify;
}
#sidebar-wrapper {
width: 220px;
float: $endSide; 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 */
}
width: 410px;
float: $startSide; 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 */
text-align:justify;
}
#sidebar-wrapper {
width: 220px;
float: $endSide; 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 */
}
Tukar float pada main-wrapper dengan float pada sidebar-wrapper dan sebaliknya sehingga baris kodenya menjadi seperti terlihat dibawah ini:
#main-wrapper {
width: 410px;
float: $endSide; 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 */
text-align:justify;
}
#sidebar-wrapper {
width: 220px;
float: $startSide; 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 */
}
width: 410px;
float: $endSide; 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 */
text-align:justify;
}
#sidebar-wrapper {
width: 220px;
float: $startSide; 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. Sekarang sidebar telah berada disebelah kiri kolom posting (posting blog).
Catatan:
- Variabel $startside bisa diganti dengan left (kiri), dan $endside dengan right (kanan)
- Untuk memudahkan pencarian baris kode, gunakan 'kotak pencari', tekan Ctrl + F, lalu ketikan baris kode yang dicari dan tekan enter. Browser yang digunakan disini adalah Internet Explorer (IE). Untuk browser lain, 'kotak pencari' letaknya sedikit berbeda
- Variabel $startside bisa diganti dengan left (kiri), dan $endside dengan right (kanan)
- Untuk memudahkan pencarian baris kode, gunakan 'kotak pencari', tekan Ctrl + F, lalu ketikan baris kode yang dicari dan tekan enter. Browser yang digunakan disini adalah Internet Explorer (IE). Untuk browser lain, 'kotak pencari' letaknya sedikit berbeda
Gb 1. Tampilan menu Edit HTML dan 'kotak pencari' pada browser IE.
Gb 2 dan 3. Sidebar pada sebelah kanan dan kiri kolom posting.
3 komentar:
Kalo sidebarnya ada 2 bos kanan dan kiri
Sementara kolom posting dipndah ke kiri?
Kalo gitu coba float pada main-wrapper dirubah menjadi left, sedang float pada ke dua sidebar menjadi right semua.
Mantep Info nya,Ijin Nyimak Gan
Posting Komentar