Do you like the widgetized footer that he use here at Shoutmeloud in thesis theme?It is the asnio footer that makes it look so good.Do you know how can you add this footer to your thesis theme? Asnio footer was developed by asnio,an young blogger who writes at asnio.com.This thesis three column footer makes you 3 ready made widgets for footer and an copyright section for your thesis wordpress theme.
It is very easy to install this thesis widgetized three column footer.

asnio widgetized footer

 
STEPS TO INSTALL ASNIO 3 COLUMN THESIS FOOTER:
Firstly, you have to open your custom_functions.php and custom.css. If you are using Thesis , it can be easily implemented in your Thesis Options -> Custom File Editor.
To make this functions work properly, you should add this code to custom_fuctions.php:

/* Thesis Footer*/
function asnioFooter() { ?>
<div id=”container”>
<div id=”foot”>
<h2>Blog Categories</h2>
<!– <span>Information Covered on the Blog</span> –>
<ul id=”cats”>
<?php wp_list_cats(‘sort_column=id&hide_empty=0&optioncount=0&hierarchical=0′); ?>
</ul>
<div>
<ul>
<?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 1′) ){    ?>
<li>
<div>
<h3><?php _e(‘Footer Widget 1′, ‘thesis’); ?></h3>
<p>You can edit the content that appears here by visiting your Widgets panel and modifying the <em>current widgets</em> there.</p>
</div>
</li>
<? } ?>
</ul>
</div>
<div>
<ul>
<?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 2′) ) { ?>
<li>
<div>
<h3><?php _e(‘Footer Widget 2′, ‘thesis’); ?></h3>
<p>You can edit the content that appears here by visiting your Widgets panel and modifying the <em>current widgets</em> there.</p>
</div>
</li>
<? } ?>
</ul>
</div>
<div>
<ul>
<?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 3′) ) { ?>
<li>
<div>
<h3><?php _e(‘Footer Widget 3′, ‘thesis’); ?></h3>                                                                <p>You can edit the content that appears here by visiting your Widgets panel and modifying the <em>current widgets</em> there.</p>
</div>
</li>
<? } ?>
</ul>
</div>
<div id=”copyright”>
<ul>
<?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer Copyright’) ) { ?>
<li>
<div>
<h3><?php _e(‘Copyright’, ‘thesis’); ?></h3>
<p>You can edit the content that appears here by visiting your Widgets panel and modifying the <em>current widgets</em> there.</p>
</div>
</li>
<? } ?>
</ul>
</div>
</div>
</div>
<? }
add_action(‘thesis_hook_after_html’, ‘asnioFooter’);
remove_action(‘thesis_hook_footer’, ‘thesis_attribution’);
remove_action(‘thesis_hook_footer’, ‘thesis_admin_link’);
register_sidebar(array(‘name’=>’Footer 1′, ‘before_title’=>’<h3>’, ‘after_title’=>’</h3>’));
register_sidebar(array(‘name’=>’Footer 2′, ‘before_title’=>’<h3>’, ‘after_title’=>’</h3>’));
register_sidebar(array(‘name’=>’Footer 3′, ‘before_title’=>’<h3>’, ‘after_title’=>’</h3>’));
register_sidebar(array(‘name’=>’Footer Copyright’, ‘before_title’=>’<h3>’, ‘after_title’=>’</h3>’));
/* END footer customization */

Then, you should add another code to your custom.css to make it like mine at the end. This code will define the layout, background…

/*Thesis Footer*/
#foot {
background: #2B2A2A;
border: 0.6em solid #212020;
color: #DBEDF9;
font-size: 12px;
margin: 20px auto;
overflow: hidden;
padding: 1.5em;
}
#foot a { color: #DBEDF9;  text-decoration: none; }
#foot a:hover { color: #198DC9; }
#foot h2{color: #fff; font-size: 22px; font-weight: bold; letter-spacing: 1px; font-variant:small-caps; margin:10px 0 10px 15px;}
#foot h3 {color:#fff;font-size:18px;font-variant:small-caps;font-weight:bold;letter-spacing:0px;margin:0px 0 15px 0px;text-transform:none;border-bottom:3px double #666666;line-height:30px;}
#foot ul li ul{ list-style-type: square; margin-left: 0px; }
#foot ul.sidebar_list { padding: 1.8em 30px 0 0; }
#foot li.widget .widget_box { background: #000000; border: 0; }
#foot li.widget {margin-bottom:5px !important;}
#foot .textwidget p { line-height: 22px; margin-bottom: 11px; }
#foot li.widget_tag_cloud a{color:#ddd !important;line-height:25px;}
#foot li.widget_tag_cloud a:hover{color:#198DC9 !important;}
#foot .col { float: left; list-style: none; width: 33.3%; }
#foot li.widget_links li {background: #3f3f3f; border: 1px solid #111; line-height: 1.4em; -moz-border-radius: 5px; padding: 0.5em; -webkit-border-radius: 5px; overflow: hidden; color:#000000;}
#foot li.widget_links li:hover {background: #4f4f4f; border: 1px solid #7a7a7a; line-height: 1.4em; -moz-border-radius: 5px; padding: 0.5em; -webkit-border-radius: 5px; overflow: hidden; color:#000000;}
#foot li.widget_links div.left {color: #3399FF; float: right; font-size: 12px; text-transform: uppercase;}
#foot li.widget_links ul li a {color: #f2f2f2 !important;}
#foot li.widget_links ul li a:hover {color: #f2f2f2 !important;}
#foot .footer_items {
/* contents alignment */
text-align: left;
/* widget width */
width: 285px;
/* space between widgets */
padding-right: 10px;
/* text color */
color: #2361A1;
/* do not change these! */
display: inline-block;
float: left;
height: 100%;
}
#foot .footer_items ul li { list-style: none; }
#foot .footer_items ul { margin: 0px; padding: 0px; }
#cats {
background: #3D3C3C;
list-style-type: none;
margin-top: 13px;
overflow: hidden;
padding: 10px 0 7px 20px;
}
#cats li {
float: left;
font-size: 1.2em;
line-height: 1.8em;
margin: 0 2px 5px 0;
width: 165px;
}
#copyright {
border-top: 1px ;
clear: both;
font-size: 13px;
letter-spacing: 1.3px;
line-height: 21px;
padding-top: 10px;
}
#copyright ul li { list-style: none; }
#copyright p { font-size: 13px; }
#copyright ul.sidebar_list, #copyright .textwidget, #copyright li.widget .widget_box, #copyright li.widget { margin: 0; padding: 0; }
/* END customization of footer */

Hope you have successfully added the 3 column asnio widgetized footer to your thesis wordpress theme.If you have any doubts then post a comment here.
If you like this post then do share it on facebook and twitter.