Add & customize Asino Style three column widgetized footer Thesis

Gowtham V
5 Min Read

Do you want to have a cool looking stylish 3 column footer in your thesis theme,then Asino style three column is the best choice for your thesis wordpress theme. We have already made a post on how to add three column widgetized footer to thesis theme Follow these simple steps to create a Asino footer in thesis theme like this

Asino style footer,thesis

#Open wp-content>>themes>>thesis_18>>custom>>custom_functions.php using a ftp software like filezilla #Now add the following asino function code to the custom functions file

function asnioFooter() { ?>
<div id="container">
<div id="foot">
<h5>Blog Categories</h5>
<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>
<!-- Please do not remove these lines. If you have a developers license, you may remove the thesis copyright, but do not remove the Asino footer copyright unless you have paid the $5 fee. Feel free to remove these comment lines however -->
<p>Get smart with the <a href="https://diythemes.com/thesis/">Thesis WordPress Theme</a> from DIYthemes.</p>
<p>Footer by <a href="https://asnio.com/">Asnio</a>.</p>
</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>'));

#Now copy and paste the customization code below to your custom.css file located in  wp-content/themes/thesis_18/custom/custom.css

#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; border-bottom: 1px dashed #DBEDF9; text-decoration: none; }

#foot a:hover { background: #DBEDF9; color: #3D3C3C; }

#foot span.cat, #foot h3 { /* controls all blue headings */
color: #23A2D7; font-size: 16px; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; }

#foot h5 { font-size: 23px; }

#foot ul li ul { list-style-type: square; margin-left: 10px; }

#foot ul.sidebar_list { padding: 1.8em 30px 0 0; }

#foot li.widget .widget_box { background: none; border: 0; }

#foot .textwidget p { line-height: 22px; margin-bottom: 11px; }

#foot .col { float: left; list-style: none; width: 33.3%; }

#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 dashed #3D3C3C;
clear: both;
font-size: 13px;
letter-spacing: 1.3px;
line-height: 21px;
padding-top: 10px;
}

#copyright p { font-size: 13px; }

#copyright ul.sidebar_list, #copyright .textwidget, #copyright li.widget .widget_box, #copyright li.widget { margin: 0; padding: 0; }

#Its all done, you have successfully added a three column asino style footer to your thesis theme.

Hope you have added the footer successfully to your wordpress blog:-)

This post is a part of the thesis customization series you can also take a look at the other posts in this topic

How to remove thesis footer(attribution)link for thesis theme and add your own site links to footer

How to add three column widgetized footer to thesis theme-Thesis customization

How to add google +1 (plus one)share button to thesis theme.

If there is any problem creating a Asino style footer in your thesis theme..We will help you through the comment section .

Share This Article