Add three Column footer in Blogger
Today, Every blogger wants to give a full description or any other information about their site/blog.But because of Layout problem some of the bloggers are unable to do this thing.Below is a easy tutorial is given for making three Column Footer.Live example can be seen on my blog scroll down and see it.
So, let start...
Adding to your blog.
1.) Login to Blogger → Templates → Edit HTML
2.) Find ( Ctrl + F ) the code ]]></b:skin> paste the following code just above it.
Code
.footer-main{margin-left:auto;margin-right:auto;}
footer-outer {
background:#111111;
box-shadow:1px 2px 4px #444444;
-moz-box-box-shadow:1px 2px 4px #444444;
-web-kit-box-shadow:1px 2px 4px #444444;
-goog-ms-box-shadow:1px 2px 4px #444444;
margin-left:auto;
margin-right:auto;
width:960px;
}
.footer-outer p
{
color:#dcdcdc;
}
.footer-outer li
{
list-style:none;
}
.footer-outer a
{
color:#dcdcdc;
}
.footer-outer a:hover
{
color:#ffffff;
}
.footer-outer h2{
color:#dcdcdc;margin-left:18px;font-family:Helvetica,Arial;font-weight:bold;;padding-bottom:5px;font-size:18px;border-bottom:1px solid #222222 ;
}
4.) Now find </body> and paste following code just above it. Preview your blog and Save the template.
<footer>
<div class='footer-main'>
<div class='footer-outer'>
<div class='footer-cap-top cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left footer-fauxborder-left'>
<div class='fauxborder-right footer-fauxborder-right'/>
<div class='region-inner footer-inner'>
<macro:include id='footer-sections' name='sections'>
<macro:param default='2' name='num' value='3'/>
<macro:param default='footer' name='idPrefix'/>
<macro:param default='foot' name='class'/>
<macro:param default='false' name='includeBottom'/>
</macro:include>
</div>
</div>
<div class='footer-cap-bottom cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>
</div>
</footer>
5.) Click Save
Customization
Now go to Layout and add the gadgets and enjoy..
Last Words
If you find any problem please leave it in 'Online Help Box'.
