Cara Melebarkan Halaman Blog

Setiap blogger pasti mempunyai tampilan blog yang berbeda - beda, ada yang ingin halamannya penuh ada juga yang menyisakan beberapa senti dari garis pinggir. Nah kali ini saya akan share tentang bagaimana cara melebarkan halaman blogger.  Sebenarnya ada beberapa cara: 

     1.    Jika anda menggunakan template bawaan blogger itu mudah sekali caranya. Anda 
     tinggal masuk ke dashboard blogger anda kemudian klik template atau tema 
     kemudian pilih sesuaikan dan setelah itu pilih atau klik sesuaikan lebar, silahkan 
     geser sesuai selera anda. 

     2.     Cara yang kedua ini khusus untuk template yang sama seprti template blog yang sedang 
     anda baca ini. 
         

     Pertama - tama masuk dashboard ke Edit HTML. Kemudian cari 
     kode header-wrapper, gunakan Ctrl + F untuk mempermudah pencarian. Jika sudah 
     ketemu ganti dengan seperti dibawah ini .

.header-wrapper{width:100%;color:#333;overflow:hidden;position:relative;z-index:999;margin:0 auto}
#header{width:232px;float:left;width:auto;overflow:hidden;z-index:999;margin:0;padding:0}
#header-inner{margin:0 auto;padding:0}
#header h1,#header p{font:30px Oswald;line-height:30px;color:#333;text-shadow:1px 1px #fff, 1px 1px #ccc, 2px 2px #ddd, 3px 3px #eee;padding-bottom:10px;margin:0}
#header h1 a,#header h1.title a:hover{color:#48b;text-decoration:none}
#header .description{color:#0a2e56;font:Italic 14px Georgia;text-shadow:none}
#header img{border:0 none;background:none;width:auto;height:auto;margin:0 auto}
#header2{float:right;width:auto;margin:0 auto}
.header2 .widget{margin:0 auto;padding:0}

Setelah itu cari kode outerpic-wrapper, letaknya biasanya dibawah hearder-wrapper jika tidak ketemu gunakan Ctrl + F untuk mempermudah pencarian. Jika sudah ketemu ganti kode seperti pada kode berikut ini

.outerpic-wrapper{background:#fff;width:100%;box-shadow:0 10px 10px #666;-moz-box-shadow:0 10px 10px #666;overflow:hidden;-webkit-box-shadow:0 10px 10px #666;filter:progid:DXImageTransform.Microsoft.Shadow(color='#999999',Direction=125,Strength=6);padding:10px}
.content-wrapper{position:relative;max-width:960px;margin:0 auto}
.outer-wrapper{position:relative;width:100%;padding:0}
.main-wrapper{width:640px;margin-right:10px;float:left;word-wrap:break-word;overflow:hidden;}
.clr{clear:both;float:none}

Kemudian cari kode sidebar-wrapper, letaknya biasanya dibawah outerpic-wrapper jika tidak ketemu gunakan Ctrl + F untuk mempermudah pencarian. Jika sudah ketemu ganti kode seperti pada kode berikut ini

.sidebar-wrapper,.sidebar1-wrapper{width:310px;float:right;word-wrap:break-word;overflow:hidden;}
.sidebar h2{background:#ddd;color:#333;font:14px Oswald;margin:0;padding:5px 0 5px 10px;text-shadow:0 1px 1px #fff;text-transform:uppercase}
.sidebar{background:#f6f6f6;color:#666;line-height:1.3em;border-top:none;font:11px Arial}
.sidebar li{line-height:1.3em;margin:0;padding:5px 0 4px;border-bottom:1px dashed #ddd}
.sidebar .widget{;margin:2px 0 10px;padding:0}
.sidebar .widget-content{margin:0 auto;padding:0 10px;}
.sidebar a:link,.sidebar a:visited{font:bold 12px Arial;color:#555;text-decoration:none}
.sidebar li a:hover{color:#015bb3}
.sidebar ul{list-style:none;margin:0;padding:5px 0}
.sidebar1 ul{list-style:none;padding:0;margin:0;}
.sidebar1 .widget {margin:0px 0px 0px;padding:0}

Setelah itu simpan template dan lihat blog anda apakah ada perubahan pada lebar halaman. Tapi pada intinya untuk mengatur ukuran lebar template blog sobat tinggal mengubah width, height, margin & padding pada kode CSS seperti header-wrapper, content-wrapper, outer-wrapper, main-wrapper & sidebar-wrapper pada menu Edit HTML.