Hello visitor now add three column footer on your blogger blog this is very easy and you can add cool gadget in footer by this tricks. now you can do this by simple step .
Follow Below simple step to adding this on your blog now--->>>>
* First go to your blogger Dashboard .
* Now click on Design tab and edit HTML .
* Click to small box for expanding your template now.
* Now find this code
<div id='footer-wrapper'> <b:section class='footer' id='footer'/> </div>
* Now add below code after </div>
<div id='new-footer-wrapper'> <div id='column1-wrapper'> <b:section class='new-footer' id='new-footer1' preferred='yes'/> </div> <div id='column2-wrapper'> <b:section class='new-footer' id='new-footer2' preferred='yes'/> </div> <div id='column3-wrapper'> <b:section class='new-footer' id='new-footer3' preferred='yes'/> </div> <div style='clear: both;'/> </div>
* Now again search ]]></b:skin> with CTRL+F key. and copy below code paste before ]]></b:skin>
#new-footer-wrapper
{background: #E1E2B8;
margin: 0 auto;
width:98%;
padding: 0 10px 10px 0;
}
#column1-wrapper, #column2-wrapper, #column3-wrapper
{
float: left; display:inline-block;
width: 33%;padding: 0px 0px 0px 0px;
text-align: left; word-wrap: break-word;
overflow: hidden;
}
.new-footer h2
{ margin: 0px 0px 0px 0px; padding: 4px 10px 4px 10px; text-align: left; color: #222222; background: #C1C298; font-weight: bold;font-size: 0.9em;
}
.new-footer .widget
{
margin: 10px 0 0 10px; border: 1px solid #F1F5CA; background: #F7FCDF;
}
.new-footer .widget-content { padding: 0px 5px 5px 5px; }
.new-footer ul { list-style-type:square; margin-left:15px; }
Now save your template now you are done.
|
0 Responses So Far: