Mengetahui Ukuran Header, Posting, Sidebar, Footer & Lebar Blogger

Dalam edit template sobat, perlu kita ketahui berapa ukuran atau lebar elemen-elemen yang ada di blog. Untuk mengetahui Ukuran Header, Posting, Sidebar, Footer & Lebar Blogger semilyar trik blogger ingin sharing ke teman-teman. Sharing dalam posting ini mudah-mudahan bisa membantu mengedit blog sahabat semua. Yuk mulai saja.

Landscaping company

1. Mengetahui Ukuran / Lebar header

#header-wrapper{

background: #ffffff;

width: 900px;

height: 160px;

font-size: 12px;

margin: 0px auto 0px;

padding: 0px;

overflow: hidden;

}

2. Mengetahui Ukuran / Lebar halaman Posting

#main-wrapper{

float:left;

width:590px;

margin:0px 0px 5px 0px;

padding:13px 10px 0px 10px;

overflow: hidden;

}

3. Mengetahui Ukuran / Lebar sidebar

#sidebar-wrapper{

float:left;

width:320px;

margin:13px 0px 5px 0px;

padding:0px;

line-height:19px;

display: inline;

}

Update : Banyak sekali kode sidebar yang bisa dipakai misal #rsidebar-wrapper{ atau #right-sidebar-wrapper{ dll, jadi disesuaikan saja.

4. Mengethui Ukuran / Lebar Footer

/* Footer

----------------------------------------------- */

#footer {

  width:950px;

  clear:both;

  margin:0 auto;

  padding-top:15px;

  line-height: 1.6em;

  text-transform:uppercase;

  letter-spacing:.1em;

  text-align: center;

}

a. Untuk mengedit ukuran/lebar Halaman Blog

Cari kode di bawah ini:

#outer-wrapper {

width: 660px;

margin:0 auto;

padding:10px;

text-align:$startSide;

font: $bodyfont;

}

b. Untuk mengedit ukuran/lebar Halaman Posting

Cari kode di bawah ini:

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

}

c. Untuk mengedit ukuran/lebar Sidebar Blog

Cari Code di bawah ini:

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

}

d. Untuk mengedit ukuran Header Blog,

Cari Code di bawah ini:

#header-wrapper {

width:660px;

margin:0 auto 10px;

border:1px solid $bordercolor;

}

e. Untuk mengedit ukuran Footer Blog

Cari Code di bawah ini:

#footer {

width:660px;

clear:both;

margin:0 auto;

padding-top:15px;

line-height: 1.6em;

text-transform:uppercase;

letter-spacing:.1em;

text-align: center;

}

Jika sahabat tidak menemukan kode seperti di atas, untuk mengetahui element seperti header, posting, sidebar dan lebar blogger, cukup mencari kode yang mirip dan ditunjukkan dengan width: (LEBAR) dan height:(TINGGI) caranya cukup ketik apa yang dicari dalam edit HTML, setelah terbuka halamannya, Ctl+F, akan ada disudut kanan atas kotak pencarian.....Selamat mencoba.