How To Add A Footer Widget Area to Custom Genesis Child Theme

To add theme support for footer widgets, add the following code to your functions.php file.

//* Add support for 3-column footer widgets
add_theme_support( 'genesis-footer-widgets', 3 );

The number 3 represents how many columns (widget areas) you would like in the footer area.

Also, add the following CSS to your custom child theme’s style.css file. (Style as desired first.)

/* Footer Widgets for Custom Childe Theme */

.footer-widgets {
  border-top: 2px solid #1e1e1e;
clear: both;
line-height: 1.5;
overflow: hidden;
padding: 32px 0 16px;
padding: 2rem 0 1rem;
}

.footer-widgets p {
margin-bottom: 16px;
margin-bottom: 1rem;
}

.footer-widgets .widget {
margin-bottom: 24px;
margin-bottom: 1.5rem;
}

.footer-widgets .widget-area ul li {
list-style-type: none;
margin-bottom: 6px;
margin-bottom: 0.375rem;
word-wrap: break-word;
}

.footer-widgets-1 {
margin-right: 4.166666666%; /* 48px / 1152px */
}

Check out the full article below on Studiopress:

https://my.studiopress.com/tutorials/add-footer-widgets/

Have any tricks and tips you’d like to share about customizing the genesis theme footer widgets? Leave a comment below!