Dalam edit template, perlu kita ketahui berapa ukuran atau lebar elemen-elemen yang ada di blog. Untuk mengetahui Ukuran Header, Posting, Sidebar, Footer & Lebar Blogger tersebut saya ingin mencoba sharing ke teman-teman. Sharing dalam posting ini mudah-mudahan bisa membantu mengedit blog sobat blogger semua. Yuk kita 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;
}
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;
}
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;
}
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;
}
----------------------------------------------- */
#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;
}
#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 */
}
#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 */
}
#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;
}
#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;
}
#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 sobat 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)
Dengan Mengetahui Ukuran Header, Posting, Sidebar, Footer & Lebar Bloggertentunya akan memudahkan sobat mengganti dan mengedit blog dengan sangat mudah.
0 komentar:
Post a Comment