Jumat, 25 Oktober 2013
Browse Manual »
Wiring »
2
»
bawah
»
cara
»
di
»
elemen
»
header
»
kolom
»
membuat
»
Cara Membuat 2 Kolom Elemen di bawah Header
7. Klik Simpan Template. dan lihat hasilnya :D
Cara Membuat 2 Kolom Elemen di bawah Header
Cara Membuat 2 Kolom Elemen di bawah Header - Menambahkan 2 Kolom Elemen dibawah header mungkin adalah salah satu cara untuk menambah tempat untuk kita meletakkan gadget. Saya sendiri telah mempraktekannya, hasilnya lumayan juga, tapi ada bagian yang tidak memuaskan, makannya saya menambahkan sedikit CSS. Contohnya sobat bisa lihat gambar dibawah ini :
Berikut Tutorialnya :
1. Login ke Account Blogger sobat
2. Pilih Dasbor, lalu Rancangan
3. Klik Edit HTML > Centang "Expand Template Widget"
4. Cari kode ]]></b:skin> (Tekan Ctrl+f untuk mempermudah pencarian kodenya)
5. Copy kode dibawah ini tepat diatas kode ]]></b:skin>
#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
6. Cari kode <div id=main-wrapper>, bila sudah Copy kode berikut tepat diatasnya
<div id=box-main-container>
<div id=box1 style=width: 50%; float: left; margin:0; text-align: left;>
<b:section class=box-column id=col1 preferred=yes style=float:left;/>
</div>
<div id=box2 style=width: 50%; float: right; margin:0; text-align: left;>
<b:section class=box-column id=col2 preferred=yes style=float:right;/>
</div>
<div style=clear:both;/>
</div>
<div id=box1 style=width: 50%; float: left; margin:0; text-align: left;>
<b:section class=box-column id=col1 preferred=yes style=float:left;/>
</div>
<div id=box2 style=width: 50%; float: right; margin:0; text-align: left;>
<b:section class=box-column id=col2 preferred=yes style=float:right;/>
</div>
<div style=clear:both;/>
</div>
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar