Cara Mengatasi Tata Letak Yang Bejejer ke Bawah Pada Dashboard - Mungkin sobat pernah mengalami hal seperti ini. Setelah sobat mencari banyak cara akhirnya tak berhasil juga hingga pada saat sobat mengganti template Tata letaknya kembali normal.
Sebenarnya cara mengatasinya sangat mudah tak perlu mengganti template blog sobat, sobat pasti heran mengapa tu bisa terjadi kali ini saya akan mengupasnya setajam silet dan memberi tutorial memperbaikinya simak tulisan dibawah ini.
error itu terjadi karena ada CSS yang hilang. CSS yang hilang diakibatkan karena menyembunyikan / menonaktifkan CSS Stylesheet Blogger, yang biasanya dilakukan untuk validasi CSS3 atau HTML5. Tidak jadi masalah ketika sobat sudah terbiasa dengan tampilan berjejer, saya pribadi lebih enak tampilan seperti biasa, lebih mudah memisahkan mana sidebar dan mana footer.
Intinya, tampilan widget editor / tata letak yang berjejer kebawah karena Menonaktifkan CSS Reset Stylesheet Blogger. Dan saat ini saya akan berbagi tutorial bagaimana mengembalikan tataletak widget editor seperti semula.
Cara Mengembalikan Tata Letak Yang Berjejer ke Bawah
LANGKAH 1 : Fahami ukuran komponen utama blog sobat
Biasanya, ukuran komponen utama sudah ada pada CSS blog, seperti #outer-wrapper #header-wrapper #main-wrapper dst. Untuk lebih memahami komponen utama blog sobat, saya contoh kan sepeti gambar di bawah ini :
LANGKAH 2 : Tulis kembali ukuran dan posisi komponen utama blog sobat.
Copy dari CSS yang ada, ukuran komponen utama blog. Sobat bisa menulisnya di notepad terlebih dahulu. Dari contoh gambar diatas, untuk penulisannya seperti ini :
#header-wrapper, #outer-wrapper, #footer-wrapper {width:970px}
#header-left {width:200px;float:left}
#header-right {width:728px;float:right}
#main-wrapper {width:650px;float:left}
#sidebar-wrapper {width:300px;float:right}
.footer {width:315px;float:left}
LANGKAH 3 : Simpan kode diatas, diantara kode menon-aktifkan CSS Reset. Perhatikan posisi penyimpanannya!
<style type="text/css"><!-- /* <b:skin><![CDATA[ simpan kode CSS tadi di sini */]]></b:skin>
hasil akhirnya seperti ini :
<style type="text/css"><!-- /* <b:skin><![CDATA[
#header-wrapper, #outer-wrapper, #footer-wrapper {width:970px}
#header-left {width:200px;float:left}
#header-right {width:729px;float:right}
#main-wrapper {width:650px;float:left}
#sidebar-wrapper {width:300px;float:right}
.footer {width:315px;float:left}
*/]]></b:skin>
Simpan template.Selamat mencoba.. silahkan laporan di sini apabila masih ada kendala :)
