Genesis Footer

Website footers have become so much more than the end of the scroll for a site. Once a place to only find some credit to the designer or copyright/trademarks of the blog, they have now evolved into their own significant part of the site. They contain anything from contact information and twitter feeds, to contact forms and any extra information or functionality that really increases the usability of a site.

The default genesis child theme has a “go to top” link and a credit section, both of which are filterable. If you are looking to just change the text of either, you may want to check out these other tutorials.

Changing “Return to Top of the Page” text in the footer.
Giving Credit Where Credit Is Due

If not, continue on.

In addition to the filters available in the footer, it is possible to unhook the entire area and replace it with custom code or a widget-ed area. This tutorial will go over removing the default footer and replacing it with a widget-ed area. With tons of widgets available, the possibilities of creating a full functioning footer custom to your needs is endless and as simple as drag and drop; after, of course, following these steps below.

Removing the default footer:
to remove the content of the footer simply add the following to your child theme’s functions.php
remove_action('genesis_footer', 'genesis_do_footer');

This code will register our widget areas for use in our footer. Open your child theme’s function.php and add the following code.

genesis_register_sidebar(array(
	'name'=>'Footer Left',
	'description' => 'This is the first column of the footer section.',
	'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
	'name'=>'Footer Middle',
	'description' => 'This is the second column of the footer section. Half the size of The First column this section is great for lists like a blogroll widget. ',
	'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
	'name'=>'Footer Right',
	'description' => 'This is the last column of the footer section.',
	'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
	'name'=>'Footer Bar',
	'description' => 'This is the row for below the 3 columns.',
	'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));

adding our custom footer code:

add_action('genesis_footer', 'do_custom_footer');
function do_custom_footer() { ?>

<div id="footer-widgetized">
    <div class="wrap">
    	<div class="footer-col1">
        	<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Left') ) : ?>
            	<h4><?php _e("Footer Left Widget", 'genesis'); ?></h4>
            	<p><?php _e("This is an example of a widgeted area. You can add content to this area by visiting your Widgets Panel and adding new widgets to this area.", 'genesis'); ?></p>
	    	<?php endif; ?>
   		</div><!-- end .footer-col1 -->
    	<div class="footer-col2">
        	<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Middle') ) : ?>
            	<h4><?php _e("Footer Middle Widget", 'genesis'); ?></h4>
            	<p><?php _e("This is an example of a widgeted area. You can add content to this area by visiting your Widgets Panel and adding new widgets to this area.", 'genesis'); ?></p>
   	    	<?php endif; ?>
    	</div><!-- end .footer-col2 -->
    	<div class="footer-col3">
        	<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Right') ) : ?>
            	<h4><?php _e("Footer Right Widget", 'genesis'); ?></h4>
            	<p><?php _e("This is an example of a widgeted area. You can add content to this area by visiting your Widgets Panel and adding new widgets to this area.", 'genesis'); ?></p>
	    	<?php endif; ?>
    	</div><!-- end .footer-col3 -->
    	<div class="footer-bar">
        	<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Bar') ) : ?>
            	<h4><?php _e("Footer Bar", 'genesis'); ?></h4>
            	<p><?php _e("This is an example of a widgeted area. You can add content to this area by visiting your Widgets Panel and adding new widgets to this area.", 'genesis'); ?></p>
   	    	<?php endif; ?>
    	</div><!-- end .footer-bar -->
    </div><!-- end .wrap -->
</div><!-- end #footer-widgetized -->

<?php }

* Bonus
This is just basic structure to set you in the right direction.

#footer-widgetized {
	width: 960px;
	font-size: 11px;
	margin: 0 auto 0;
	padding: 0;
	overflow: hidden;
	clear: both;
	}

#footer-widgetized .wrap {
	width: 940px;
	margin: 0 auto 0;
	padding: 0;
	}

#footer-widgetized .widget {
	background: none;
	margin: 0;
	padding: 0;
	border: none;
	}

.footer-col1 {
	width: 500px;
	float: left;
	margin: 0;
	padding: 0 20px 0 0;
	}

.footer-col2 {
	width: 200px;
	float: left;
	margin: 0;
	padding: 0 20px 0 0;
	}

.footer-col3 {
	width: 200px;
	float: right;
	margin: 0;
	padding: 0 0 0 0;
	}

.footer-bar {
	width: 940px;
	float: right;
	margin: 0;
	padding: 0;
	}
#footer-widgetized .footer-bar li {
	display:inline;
	padding:5px;
	}