Create Widgetized Fat Footer For Thesis

Create Widgetized Fat Footer For Thesis

It is pretty tough and confusing for those who are not familiar with programming to get their hand, fully utilised and push Thesis to its maximum potential.

This due to the fact that rather have tweak the code for the particular files such single.php and header.php, we have to tweak the custom_functions.php and custom.css. It uses the concept of hook for customization which any tweaking in the theme will be done in custom_functions.php and custom.css so that if there is any update on Thesis, any tweaks will not be removed and overwritten as both files are specifically for tweaks and theme modification.

Among the hardest part of tweaking Thesis is creating fat footer for our WordPress theme as there are two sections of the tweaks – adding extra 4 ‘sidebar’ at the footer area and widgetized the footer in ensuring no manual changes in the custom_functions.php and custom.css files are required.

Along this tweak, I will also give the tweak for footer credits to make the the footer credits blend into the fat footer and widgetized the multimedia box to let you manage the multimedia box through widget rather manually tweaking it.

The code is taken from SimpleOrange – free Thesis skin but I have tweaked the codes solely for the purpose of this tutorial.

First, paste below codes into your custom_functions.php

function custom_footer_attribution () { ?>
</ul>
<br style=”clear:both;” />
<p><a href=”http://huzzer.com”>Huzzer Magazine</a> supports <a href=”http://diythemes.com/?
a_aid=4a69ac93c7e60″>Thesis Theme</a></p>
<p>Copyright &copy 2009 <a href=”<?php bloginfo(‘url’); ?>”><?php bloginfo(‘name’); ?></a>. All rights
reserved.</p><br/>
<?php }
function full_width_nav() { ?>
<div id=”nav_area”>
<div>
<?php thesis_nav_menu(); ?>
</div>
</div>
<?php }
if ( function_exists(‘register_sidebar’) )
register_sidebar(array(‘name’=>’Media Box’,
‘before_widget’ => ‘<div>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
));
register_sidebar(array(‘name’=>’Footer 1’,
‘before_widget’ => ‘<li>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
));
register_sidebar(array(‘name’=>’Footer 2’,
‘before_widget’ => ‘<li>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
));
register_sidebar(array(‘name’=>’Footer 3’,
‘before_widget’ => ‘<li>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
));
register_sidebar(array(‘name’=>’Footer 4’,
‘before_widget’ => ‘<li>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
));
function mediabox_widget() {
if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Media Box’)  ) :
endif;
}
function footer1_widget() { ?><ul> <?php
if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 1’)  ) :
endif;
}
function footer2_widget() { ?><?php
if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 2’)  ) :
endif;
}
function footer3_widget() { ?><?php
if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 3’)  ) :
endif;
}
function footer4_widget() { ?><?php
if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 4’)  ) :
endif;
}
add_action(‘thesis_hook_multimedia_box’, ‘mediabox_widget’);
add_action(‘thesis_hook_footer’, ‘footer1_widget’);
add_action(‘thesis_hook_footer’, ‘footer2_widget’);
add_action(‘thesis_hook_footer’, ‘footer3_widget’);
add_action(‘thesis_hook_footer’, ‘footer4_widget’);
remove_action(‘thesis_hook_footer’, ‘thesis_attribution’);
add_action(‘thesis_hook_footer’, ‘custom_footer_attribution’);

function custom_footer_attribution () { ?>

</ul>

<br style=”clear:both;” />

<p><a href=”YOUR SITE URL“>YOUR SITE TITLE/NAME</a> supports <a href=”THESIS URL/AFFILIATE URL“>Thesis Theme</a></p>

<p>Copyright &copy 2009 <a href=”<?php bloginfo(‘url’); ?>”><?php bloginfo(‘name’); ?></a>. All rights

reserved.</p><br/>

<?php }

function full_width_nav() { ?>

<div id=”nav_area” class=”full_width”>

<div class=”page”>

<?php thesis_nav_menu(); ?>

</div>

</div>

<?php }

if ( function_exists(‘register_sidebar’) )

register_sidebar(array(‘name’=>’Media Box’,

‘before_widget’ => ‘<div>’,

‘after_widget’ => ‘</div>’,

‘before_title’ => ‘<h2>’,

‘after_title’ => ‘</h2>’,

));

register_sidebar(array(‘name’=>’Footer 1’,

‘before_widget’ => ‘<li class=”widget”>’,

‘after_widget’ => ‘</li>’,

‘before_title’ => ‘<h2>’,

‘after_title’ => ‘</h2>’,

));

register_sidebar(array(‘name’=>’Footer 2’,

‘before_widget’ => ‘<li class=”widget”>’,

‘after_widget’ => ‘</li>’,

‘before_title’ => ‘<h2>’,

‘after_title’ => ‘</h2>’,

));

register_sidebar(array(‘name’=>’Footer 3’,

‘before_widget’ => ‘<li class=”widget”>’,

‘after_widget’ => ‘</li>’,

‘before_title’ => ‘<h2>’,

‘after_title’ => ‘</h2>’,

));

register_sidebar(array(‘name’=>’Footer 4’,

‘before_widget’ => ‘<li class=”widget”>’,

‘after_widget’ => ‘</li>’,

‘before_title’ => ‘<h2>’,

‘after_title’ => ‘</h2>’,

));

function mediabox_widget() {

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Media Box’)  ) :

endif;

}

function footer1_widget() { ?><ul class=”footer_widgets”> <?php

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 1’)  ) :

endif;

}

function footer2_widget() { ?><?php

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 2’)  ) :

endif;

}

function footer3_widget() { ?><?php

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 3’)  ) :

endif;

}

function footer4_widget() { ?><?php

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Footer 4’)  ) :

endif;

}

add_action(‘thesis_hook_multimedia_box’, ‘mediabox_widget’);

add_action(‘thesis_hook_footer’, ‘footer1_widget’);

add_action(‘thesis_hook_footer’, ‘footer2_widget’);

add_action(‘thesis_hook_footer’, ‘footer3_widget’);

add_action(‘thesis_hook_footer’, ‘footer4_widget’);

remove_action(‘thesis_hook_footer’, ‘thesis_attribution’);

add_action(‘thesis_hook_footer’, ‘custom_footer_attribution’);

Then, paste below codes into your the custom.css

.custom #footer_area { border-top: 3px solid #ffffff!important;}

.custom ul.footer_widgets { width: 100%; text-align: left;}

.custom #footer_area li.widget { width: 23%; display: inline; float: left; padding: .5em;}

.custom #footer_area li.widget h2 { border-bottom: 3px #eee !important; margin: .5em 0;}

.custom #footer_area {background-color:#eeeeee;}

If you want to make a straight line to divide the main section of your blog and your fat footer, you have to tweak the first line of the above code. If you configure the thickness of the straight line, you can adjust the 3px – either increase it to make it thicker or reduce it to make it slimmer. At the moment, the color of the line is white (ffffff).

The background of the fat footer area can also be changed to your desired color by replacing the grey color code (eeeeee) with your desired color code.

For you to change the color, replace it with the html color code of your desired color that suits your blog. If you are not familiar with the the codes, you can refer it at HTML Color Codes site.

The main tweaking has been completed. In order to make this tweak to work, you have to go to the Thesis Design Options (Appearance>Design Options). Then, go to the Framework Options and select the Full-Width framework.

Thesis Full-Width Framework

Thesis Full-Width Framework

Now, the fat footer has been properly set up for your WordPress blog.

There is another little tweak that you need to do  to widgetized your multimedia box. you have to enable “custom code” for the media box on the design options page.

Theis Multimedia Box

Thesis Multimedia Box

After you have done all the above tweaking, you just need to refresh your WordPress blog and see the new design of your blog.

If you have properly tweak your Thesis based WordPress blog and have further tweaking on the above codes to suit your WordPress blog, feel free to share the tweaking codes with us. I am eager to hear and learn from you.

3 Responses to Create Widgetized Fat Footer For Thesis

  1. Kushal Chap says:

    Hmm.. theses seems like a great theme although I dont see the point in getting it for 75 when there are already great looking themes for 75.

  2. Mike says:

    Apparently it is supposed to be optimized for seo.

  3. Craig says:

    Hi when I insert the code I get Parse error: syntax error, unexpected T_STRING, expecting ‘)’ in /wp-content/themes/thesis_17/custom/custom_functions.php on line 61

    I think it’s this line f ( function_exists(‘register_sidebar’) )

    Not sure how to fix this.

Leave a Reply

Your email address will not be published. Required fields are marked *