Cara Memperlebar Halaman Template Pada Blogspot
Cara Memperlebar Halaman Template Pada Blogspot | Blogspot | Cara Memperlebar Halaman Template Pada Blogspot. Kali ini saya akan membahas bagaimana cara memperlebar halaman pada template blog anda, setelah sebelumnya membahas cara menambah kolom di sidebar. Bagi anda yang merasa halaman pada blog terlalu sempit ikutilah postingan ini sampai akhir dijamin anda akan halaman blog anda akan lebar sesuai keinginan anda.
Langsung saja, anda hanya mengikuti intruksi yang saya berikan. Sebelumnya anda harus mengetahui bagian-bagian template yang akan anda tubah lebarnya.
Outer-wreper : Keseluruhan lebar template
Main-wrapper : Bagian pada postingan artikel anda
Sedebar-wrapper : Terletak di sebelah main wrapper
Header- wrapper : Bagian paling atas dari template
Footer-wrapper : Dasar atau berada paling bawah
Masuk pada Edit HTML, jangan centang Expand template widget. Kemudian Cari Kode atau kode yang mirip di bawah ini.
Anda bisa ganti ukuran pada teks yang berwarna merah. Anda bisa ganti dengan ukuran berapa saja, agar kelihatan rapi sesuaikan ukurannya. Contoh :
Jika lebar outer-wrapper: 950px maka jarak main-wraper dan sedebar-wraper harus disesuaikan.
Main-wrapper:500px
Sedebar-wrapper: 400px
Sedang sisanya yang 50px merupakan jarak agar sedebar dan postingan blog tidak berhimpitan.
Setelah itu jangan lupa sesuaikan juga lebar header-wraper dan footer-wraper sama dengan outer-wraper
Ingat yang perlu dirubah adalah huruf yang berwarna merah. Save kalo sudah cocok.
Semoga bermanfaat.............
Langsung saja, anda hanya mengikuti intruksi yang saya berikan. Sebelumnya anda harus mengetahui bagian-bagian template yang akan anda tubah lebarnya.
Outer-wreper : Keseluruhan lebar template
Main-wrapper : Bagian pada postingan artikel anda
Sedebar-wrapper : Terletak di sebelah main wrapper
Header- wrapper : Bagian paling atas dari template
Footer-wrapper : Dasar atau berada paling bawah
Masuk pada Edit HTML, jangan centang Expand template widget. Kemudian Cari Kode atau kode yang mirip di bawah ini.
#outer-wrapper {
width: 560px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 310px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 120px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
width: 560px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 310px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 120px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
Anda bisa ganti ukuran pada teks yang berwarna merah. Anda bisa ganti dengan ukuran berapa saja, agar kelihatan rapi sesuaikan ukurannya. Contoh :
#outer-wrapper {
width: 950px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 500px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 400px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
width: 950px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 500px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 400px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
Jika lebar outer-wrapper: 950px maka jarak main-wraper dan sedebar-wraper harus disesuaikan.
Main-wrapper:500px
Sedebar-wrapper: 400px
Sedang sisanya yang 50px merupakan jarak agar sedebar dan postingan blog tidak berhimpitan.
Setelah itu jangan lupa sesuaikan juga lebar header-wraper dan footer-wraper sama dengan outer-wraper
#header-wraper{
width: 950px
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#footer {
width:950px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
width: 950px
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#footer {
width:950px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
Ingat yang perlu dirubah adalah huruf yang berwarna merah. Save kalo sudah cocok.
Semoga bermanfaat.............
Ditulis Oleh : Unknown ~ Tips dan Trik Blogspot
Anda sedang membaca artikel tentang Cara Memperlebar Halaman Template Pada Blogspot. Oleh Chep, Anda diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
8 komentar:
nice info gan, terima kasih, kalo keseluruhn blog di rubah BG nya ya ato body??
body gan...
hmm gitu ya , oke di coba dlu
Thank Gan Maju terus..
Mampir juga gan ke blog ane
http://tejasukmana777.blogspot.com/
Mantap sob, thanks ...
untung saya nemuin ini gan..
Sip ketemu juga di sini jawabanya..terimakasih gan...
artikelnya bagus gan, kunjungi juga website saya di " CARA UNTUK MEMPERBESAR PAGE RANK WEBSITE ATAU BLOGSPOT arga yudha | web "
atau link.nya di http://www.argayudhaadhiprama.com/bagaimana-cara-memperbesar-page-rank-website-blogspot/
trimakasih dari arga yudha adhiprama
Post a Comment