Rabu, 04 Februari 2015

Memperbaki Tata Letak Blog

Anda pernah mengalami tampilan error layout/tata letak pada blogspot/blogger seperti gambar di atas? Kami punya sedikit solusinya. Langsung saja tanpa basa basi. Masuk ke blogspot kamu, klik "Template", lalu klik "Edit HTML". Letakan kode CSS dibawah ini tepat di bawah keterangan template, dibawah "---------- */".

body#layout ul{list-style-type:none;list-style:none}
body#layout ul li{list-style-type:none;list-style:none}
body#layout #outer-wrapper{overflow:visible;width:1000px}
body#layout #header{float:left;width:240px}
body#layout #header2{float:right;width:240px}
body#layout .add_widget{width:240px}
body#layout div.widget{width:240px}
body#layout #sidebar-wrapper{overflow:visible;width:240px}
body#layout #lsidebar-wrapper{overflow:visible;float:left;width:240px;margin-right:50px;}
body#layout #main-wrapper{overflow:visible;float:left;width:240px}
body#layout #rsidebar-wrapper{overflow:visible;float:right;width:240px}
body#layout #myGallery{display:none}
body#layout .featuredposts{display:none}
body#layout .fp-slider{display:none}
body#layout #navcontainer{display:none}
body#layout .menu-secondary-wrap{display:none}
body#layout .menu-secondary-container{display:none}
body#layout #skiplinks{display:none}
body#layout .feedtwitter{display:none}
body#layout div.section{font-family:sans-serif;margin:0 auto 2px;padding:0 0 10px 0;position:relative;overflow:visible}
body#layout .section-columns{margin:0} .section{width:100%}

Jika kamu tidak mengerti apa itu keterangan template, lihat gambar di bawah ini, klik gambar untuk memperbesar :



CATATAN : Tidak semua template blogspot bisa menggunakan trik ini dan tidak semua kode CSS di atas dapat digunakan. Pilihlah body#layout yang sesuai, karena akan bepengaruh pada tampilan blog secara keseluruhan. Pada template yang dipakai pada blog ini tampilan layout/tata letaknya memang acak-acak seperti gambar di atas. Saya memilih 3 baris kode seperti di bawah ini :

body#layout ul{list-style-type:none;list-style:none}
body#layout ul li{list-style-type:none;list-style:none}
body#layout #header{float:left;width:240px}

Sekali lagi, template itu sendiri perpengaruh terhadap penggunaan trik ini. Kamu bisa memnggunakan semua kode CSS diatas tanpa memilih kode seperti saya jika kamu merasa tidak error.

Tidak ada komentar:

Posting Komentar