Cara Mellebarkan Atau Menambah Ukuran halaman Template Blog

Cara Mellebarkan Atau Menambah Ukuran halaman Template Blog- Mungkin para sobat yang baru bikin blog merasa template yang di sediakan oleh blogger terlalu sempit atau kurang lebar. Sobat ingin merubah template sobat hingga menjadi lebih lebar? Bagaimana caranya..? Mungkin ada beberapa cara untuk merubah halaman template. Dan saya biasa menggunakan cara sebagai berikut,yang saya anggap paling sederhana.

Dan tidak perlu panjang lebar lagi kita mulai saja caranya.
Yang perlu kita ketahui beberapa bagian dari template yang nantinya kita
bisa ubah ukurannya:

Outer-wreper : Lebar template secara keseluruhan
Main-wrapper: Bagian dimana kita biasa posting artikel
Sedebar-wrapper : biasanya terletak di kanan atau kiri dari main wraper
Header- wrapper: Bagian paling atas dari template
Footer-wrapper : Dasar atau berada paling bawah

Sekarang masuk ke blog sobat, klik tata letak kemudian edit html.Pada edit
html sobat tidak perlu kasih centang pada Expand template widget.
Kemudian cari code sebagai berikut:

#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
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: 220px;
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 */

Sobat bisa ganti ukuran pada teks yang berwarna merah. Sobat bisa ganti dengan ukuran berapa saja,biar keliatan rapi sesuaikan ukurannya. Misal :

#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 */

Jika lebar outer-wrapper: 950px maka jarak main-wraper dan sedebar-wraper harus di sesuai:

Cara lebarkan Ukuran halaman Template Blo - 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;

Yang perlu di rubah teks yang berwana merah. Jika sudah klik pratinjau atau preview,kalau dirasa sudah cocok baru di save.

Silahkan dibagikan keteman Via

Tweet

Artikel Terkait :

Tips and Trik Blogger

• Definisi Dan Fungsi SEO di Web Blog
• Cara tes dan cek berat blog dengan 10 situs tes blog
• Cara Membuat dan Memasang Search Engine di Blog
• Cara Mengganti Icon Blog di Blogger
• Cara Membuat | Menambahkan 2 Kolom Dibawah Header di Blog
• Cara Membuat Slide Show Album Foto di Blog
• Cara memasang Link Tanpa harus di Klik Terbuka Sendiri
• Cara Mudah dan Gampang Mendapatkan Sponsor | Iklan di Blog | wordpress
• Cara Membuat Menu horizontal di Blog
• Cara Memasang / Buat FP Melayang di Blog
• Cara Memasukan atau Upload File Microsoft Word | Excel | Power Point ke Blog
• Cara memasang widged iklan banner di blog
• Cara membuat link pada gambar di blog
• Cara memasang TV Online streaming di Blog dan Kodenya
• Cara membuat Older Post dengan Angka
• Cara Agar Blog Banyak yang Follow
• Cara menambahkan Google Sitemap ke blogger
• Arti Kode Kode PadaTemplate Blog
• Cara Tes Kecepatan loading Blog biar tidak lemot
• Daftarkan Blog ke Ratusan Search Engine Directory
• Cara Menghapus widget Blog yang tersembunyi
• Cara Membuat Daftar Isi Hanya Dari Satu Label
• Cara membuat komentar pengunjung berbeda dengan admin blog
• Cara Melihat Posisi Blog Pada Search Engine