We know that Too many gadget in the header n sidebar blog, wll effect the speed of load our blog. Therefore many blogger put their blog gadget in the footer but there is a problem, some blog templates only provide a few footer culomns. and how to overcome this problem?
Of Course! to overcome this problem we just need to add some columns in the footer. How to do it?
1. Login to your blogger account.
2. Click the layout option >> Edit HTML
3. Find code
(you can use Ctrl+F to find it)
4. And then put the codes below above the
code:
#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}
5. N Then find code below:
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
6. So put the codes below under the codes in number
5 (above)
<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='#5d5d54' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>
7. Save your
Template.
To see the result of your work, click layout option. You ll see:
BEFORE:
AFTER:
gOOD LucK
Tags: Add three columns in the footer, how to add three columns in the footer, trick to adding three columns, editing template to be three columns in footer
