Home » Blogging » Make 2 or 3 until 5 column under the header template

Make 2 or 3 until 5 column under the header template

Make 2 or 3 until 5 column under the header template - Selamat datang di blog Sejarah Aceh, Info kali ini adalah tentang Make 2 or 3 until 5 column under the header template !! Semoga tulisan singkat dengan kategori Blogging !! ini bermanfaat bagi anda yang membutuhkan. Dan untuk anda yang baru berkunjung kenal dengan blog sederhana ini, Jangan lupa ikut menyebarluaskan postingan bertema Make 2 or 3 until 5 column under the header template ini ke social media anda, Semoga rezeki berlimpah ikut di permudahkan sang khalik yang maha kuasa, Selengkapnya lansung lihat infonya dibawah -->




For a friend like you want to embellish or beautify his blog with many widgets, here are my tips one that I can from Mochal namely add 2 or 3 until column under the header of my blog will be added around beautiful and added quality.

For the comrade who do not know, it is still curious, how to add these tips to the blog comrade.



Let's start follow the steps quickly and easily add to these tips into templalte comrade:

1. After comrade into Blogspot and then go to the page layout and edit the HTML
Do not forget to save the template information, click the "Download Full Template"

2. After looking around this code ]]></b:skin>

3 If the facts enter the code below at the top of the code:

#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}

Save the work of comrade

3. Then find the code <div id='main-wrapper'>, after enter the code below at the top of the code.

For 2 coloum

<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>

Save again the work of comrade

4. After saving, and then around to the layout and see the results.

Code in phase 3, when the modifications comrade may want to add 3 column under the header of the note is in need widht with floatnya!

But if the comrade is confused Mochal provide the code to add 3 column under the header, please follow the steps 1 and 2 when the phase 3 and then enter this code

For 3 coloum

<div id='box-main-container'>
<div id='box1' style='width: 33%; 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: 34%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 33%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>

For 4 coloum

<div id='box-main-container'>
<div id='box1' style='width: 25%; 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: 25%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 25%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div id='box4' style='width: 25%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col4' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>

Fior 5 coloum

<div id='box-main-container'>
<div id='box1' style='width: 20%; 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: 20%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 20%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col3' preferred='yes' style='float:left;'/>
</div>
<div id='box4' style='width: 20%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col5' preferred='yes' style='float:right;'/>
</div>
<div id='box5' style='width: 20%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col5' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>

All depends on the needs of comrade in the add widget

Hopefully useful and happy blogging


Demikianlah Artikel Make 2 or 3 until 5 column under the header template, Semoga dengan adanya artikel singkat seperti Informasi postingan Make 2 or 3 until 5 column under the header template ini, Anda benar benar sudah menemukan artikel yang sedang anda butuhkan Sekarang. Jangan lupa untuk menyebarluaskan informasi Make 2 or 3 until 5 column under the header template ini untuk orang orang terdekat anda, Bagikan infonya melalui fasilitas layanan Share Facebook maupun Twitter yang tersedia di situs ini.