Mengatasi Tata Letak yang Bejejer ke Bawah Pada Blogspot

Friday, October 31, 2014

Mengatasi Layout Blog Yang Bejejer ke Bawah - Mungkin sobat pernah mengalami tata letak / page element / widget editor tidak seperti sebelumnya, akan tetapi berjejer kebawah, tidak jelas manasidebar dan mana footer. Hal ini juga saya alami beberapa hari kebelakang setelah melakukan validasi CSS3.

Sebagian sobat banyak yang mengatakan dashboard error, padahal bukan 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-wrapperdst. Untuk lebih memahami komponen utama blog sobat, saya contoh kan sepeti gambar di bawah ini :

• Download Adobe Dreamweaver CS6 Full + Serial Key/Crack
• Trik Sederhana Internet Gratis 3 (Tri) / XL / Telkomsel dengan menggunakan SSH
• Cara Melewati Survey yang Menyebalkan Saat Mau Download
• Latihan/Belajar Menggambar Karakter Manga/Anime
• Ciri-Ciri Ilmu Biologi
• Download 12 Game PC Ringan dan Seru
• Download Film Perang Disini
• Trik Internet Gratis Smart/SmartFren di Komputer Terbaru
• Sifat Fisika dan Sifat Kimia Materi
• Contoh-Contoh Khat (Gaya Tulisan) Kaligrafi Arab

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!

&lt;style type=&quot;text/css&quot;&gt;&lt;!-- /* <b:skin><![CDATA[ simpan kode CSS tadi di sini */]]></b:skin>

hasil akhirnya seperti ini :

&lt;style type=&quot;text/css&quot;&gt;&lt;!-- /* <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    :)

Sumber: http://blog.kangismet.net/2013/09/mengatasi-tata-letak-yang-berjejer-ke-bawah.html

Popular Post

Labels: Tutorial Blog

Thanks for reading Mengatasi Tata Letak yang Bejejer ke Bawah Pada Blogspot. Please share...!