Article Blogging Tips

In this post I will discuss about how to create a 3 column footer. The function of the footer 3 column is that we will be more easily put the widgets are small size, will easily divided into three columns. eg in the first column we enter the second widget widget and blogroll with google friend connect, the third with our blog widget info site.


Simply, the way that must be done as follows :

1. Login to your account

2. Click the Layout

3. Click on Edit HTML

4. First backup your template by clicking Download Full Template and save the place that you want.

5. Copy the script below CSS code above </ b: skin>

# Footer-column-container {
clear: both;
}
. Footer-column {
padding: 10px;
}

6. Find a script like this

<div id='footer-wrapper'>
<b:section class='footer' id='footer'>
</ div>

7. Remove the script that the Supreme Court gave a red color and replace it with this script

<div id='footer-column-container'>

<div id = 'footer2' style = 'width: 30%; float: left;
margin: 0; text-align: left; '>

<b: section class = 'footer-column' id = 'col1'
preferred = 'yes' style = 'float: left;' />
</ div>

<div id = 'footer3' style = 'width: 40%; float: left;
margin: 0; text-align: left; '>
<B: section class = 'footer-column' id = 'col2'
preferred = 'yes' style = 'float: left;' />
</ div>

<div id = 'footer4' style = 'width: 30%; float: right;
margin: 0; text-align: left; '>

<b: section class = 'footer-column' id = 'col3'
preferred = 'yes' style = 'float: right;' />
</ div>

<div style='clear:both;'/> 

<p> 

<hr align='center' color='#ffae00' width='90%'/> </ p>
<div id = 'footer-bottom' style = 'text-align: center; padding:
10px; '>

<b:section class='footer' id='col-bottom' preferred='yes'>
</ b: section>

</ div>
<div style='clear:both;'/>

</ div>

8. Save your Template

Click Layout and see the results on your gadget Footer. That's how to make 3 column footer on blogger
Regards

More Article: