Merapikan Tata Letak Blogger
Merapikan Tata letak Blogger yang Acak - acakan
BERIKUT ini tips cara mengatasi masalah Layout (Tata Letak) Template Blog di Dashboard yang bertumpuk, tidak tapi, error, bermasalah, ada titik-titik, terhalangsatu sama lain, pokoe kacow lah!
"Dapur" blog kita untuk mengatur widget/gadget itu pun jadinya gak enak dipandang, meski cuma kita sebagai admin yang bisa ngeliatnya!
Have a look the contohnya:
"Kekacauan" itu terjadi biasanya setelah melakukan modifikasi template.
Setelah Googling, maka ditemukan solusinya, yaitu dengan membuat dan menambahkan kode CSS tertentu ke dalam template, guna mengatur tampilan layout blog agar rapi.
Saya masukkan kode sebagai berikut di bawah kode
body#layout .outer-wrapper {width:970px}
body#layout .content-wrapper {width:970px}
body#layout #header {width:300px;float:left;margin-top:30px}
body#layout #header2 {width:500px;float:right}
body#layout .main-wrapper {width:550px}
body#layout .sidebar-wrapper,.sidebar1-wrapper {width:300px;float:right}
body#layout #footer {width:970px}
.footer {width:215px;float:left}
body#layout ul {display: none}
Hasilnya, alhamdulillah wasyukurillah... layout blogger jadi rapi ahmad brow!
Kode mengatasi layot blogger yang acak-acakan di atas, belum tentu cocok dengan template blog Anda. Soalnya, kode template kan kadang suka beda-beda.
Intinya sih, kode atau elemen utama template terdiri dari:
1. Outer-Wrapper
2. Header-Wrapper
3. Main-Wrapper
4. Sidebar-Wrapper
5. Footer-Wrapper
Nah, sesuaikan saja dengan nama-nama itu. Cari yang mirip-mirip, juga soal tanda di depannya, titik (.) apa pagar (#).
SUMBER KODE
Ini dia sumber-sumber kode yang saya gunakan untuk merapikan layout blogger di atas.
Jika widget/gadget berjejer ke bawah semua, gunakan tips dari Kang Ismet ini.
#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}
Simpan (Copas) di posisi ini:
<style type="text/css"><!-- /*
EXAMPLE:
<style type="text/css"><!-- /*
#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}
*/]]>
Jika di tata letak blog ada titik-tiki doang, seperti gambar pertama di atas, maka gunakan kode ini:
body#layout ul {display: none;}
Copy dan paste di atas kode ]]>
CARA LAIN
Jika cara-cara di atas masih gagal, maka coba tips dari PBT berikut ini:
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%}
Simpan kode tersebut di bawah kode seperti ini:
/*
Blogger Template Style
Name
Author st
*/
atau di atas
/* Variable Definitions
bla bla.....
*/
Itu dia Cara Mengatasi Tata Letak Blogger yang Acak-Acakan. Bukan untuknewbie memang, tapi coba saja. Kalau pusing dan gagal, ganti template saja!
download now
