Perhatikan screenshoot di bawah ini
- Posisi 2 kolom berada di sebelah kanan main post :
- Posisi main post di tengah-tengah 2 kolom :
- Posisi 2 kolom berada di sebelah kiri main post :
Untuk masing-masing posisi saya akan jelaskan satu persatu, dan dalam mengubah layout kolom template, sobat blogger tidak perlu mencentang expand widget.
* Pada posisi 2 kolom di sebelah kanan main post kode pada bagian section 3 (HTML) :
Perhatikan posisi kode text yang berwarna merah, di mana kode tersebut berada di bawah div main-wrapper dan akan memberikan tampilan 2 kolom berada di sebelah kanan main post.
* Pada posisi main post berada di tengah-tengah 2 kolom maka kode pada section 3 (HTML):
Perhatikan posisi div main-wrapper di apit oleh kode yang berwarna merah dan akan memberikan tampilan main post berada di tengah 2 kolom.
* Pada posisi 2 kolom di sebelah kiri main post kode pada bagian section 3 (HTML) :
Perhatikan posisi kode text yang berwarna merah, di mana kode tersebut berada di atas div main-wrapper, tetapi hal ini belum cukup karena pada bagian section 2 (CSS) perlu di rubah posisi floatnya terutama yang kode sidebar-wrapper menjadi posisi float left karena defaultnya right ,baru akan memberikan tampilan 2 kolom berada di sebelah kiri main post.
Konsep dasar cara mengubah layout kolom adalah :
1. Posisi div pada bagian section 3 (HTML)
2. Posisi float, nilai margin dan padding apabila layout kolomnya bertabrakan dengan element lainnya
3. Trial and error
Semoga dengan tutorial cara mengubah layout kolom sobat blogger akan bisa berkreativitas dengan stylenya masing-masing.
No comments:
Post a Comment