Awesome multi column Footer For Blogger

The blogger multicolumn footer is not fully look good that why today i have presenting an beautiful multicolumn footer for blogger. This is the second multi column footer posted by our website. I have already posted an amazing footer now i introduce the easy footer its loading very fast like your template. We have seen blogger default footers are loading very slow. I have optimize the loading speed of the columns. Our team after one hour working giving the best footer and this look awesome. I have also created a demo if any one interested to see the demo then click the demo link. i have posted a topic that how to add background color in sidebar post title. But i think so adding the footer background color its not easy but adding directly our codes its very easy. Our some friendly websites are using this footer code now their pageviews is increasing because their footer is loading in one second. Now i have given our visitors to a better and advance footer column. The demo link is coming soon because i have much more work that's why i have not apply in any my blog but our many friends are applied. Demo comin soon....

Add Awesome multi column Footer in Blogger Blog

First visit Blogger Dashboard > Edit HTML > Expand Widget Templates

Then search below code using Ctrl + F

]]></b:skin>

Above the code paste the below code

/*----- Mybloggerclub.com -----*/
#lower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 960px;
background: #fff;
}
#lower-wrapper {
background: #fff;
margin:auto;
padding: 10px 0px 20px 0px;
width: 960px;
border:0;
}
#lowerbar-wrapper {
background:#fff;
float: left;
margin: 0px 10px 0px 0px;
padding-bottom: 20px;
width: 310px;
text-align: justify;
color:#000800;
font: normal 12px Arial, Tahoma, Verdana;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.lowerbar {margin: 0; padding: 0;}
.lowerbar .widget {margin: 0; padding: 10px 10px 0px 10px;}
.lowerbar h2 {background: #fff url(http://1.bp.blogspot.com/-YKnK7MQJwbI/T0z2a82H4cI/AAAAAAAABGs/ybxX22vFMSk/s200/sidebartop.png)no-repeat;
color: #fff;
font-size: 14px;
font-family: Sans-serif, Arial,verdana;
font-weight: bold;
text-transform: uppercase;
margin: 0 0 10px 0;
padding: 5px 7px 5px 7px;
height:32px;
}
.lowerbar ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
list-style-type: none;
}
.lowerbar li {
margin: 0px 0px 2px 0px;
padding: 5px 0px 1px 0px;
border-bottom: 1px dotted #ccc;
}
.lowerbar li a {
text-decoration:none; color: #BF0100;
}
.lowerbar li a:hover {
text-decoration:underline;
}
.lowerbar li:hover {
margin: 0px 0px 2px 0px;
padding: 5px 0px 1px 0px;
border-bottom: 1px dotted #ccc;
}

Now search below code using Ctrl + F

</body>

Paste the below code just above it

      <div id='lower'>
    <div id='lower-wrapper'>

    <div id='lowerbar-wrapper'>
    <b:section class='lowerbar' id='lowerbar1' preferred='yes'>
    </b:section>
    </div>

    <div id='lowerbar-wrapper'>
    <b:section class='lowerbar' id='lowerbar2' preferred='yes'>
    </b:section>
    </div>

    <div id='lowerbar-wrapper'>
    <b:section class='lowerbar' id='lowerbar3' preferred='yes'>
    </b:section>
    </div>

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

Now save your template.

Visit your blog.

Enjoy with new footer look.