How to set up a 4-column footer in the Genesis framework. I've only seen code about 3-column setups, but I need 4 for a design I'm working on. Here's my code.

functions.php

<?php
//* Do NOT include the opening php tag

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

style.css

/* 4-Column Footer (Overrides default 3-column setup in Genesis, so that code must remain in place)
---------------------------------------------------------------------------*/

.footer-widgets-1, 
.footer-widgets-2, 
.footer-widgets-3, 
.footer-widgets-4 {
	width: 21.875%; /* 252px / 1152px */
}

.footer-widgets-1, 
.footer-widgets-2, 
.footer-widgets-3 {
	float: left;
	margin-right: 4.166666666%; /* 48px / 1152px */
}
.footer-widgets-4 {
	float: right;
}

@media only screen and (max-width: 768px) {

	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3,
	.footer-widgets-4 {
		width: 47.9166666666%; /* 552px / 1152px */
	}
	
	.footer-widgets-2 {
		float: right;
		margin: 0;
	}

}

@media only screen and (max-width: 480px) {

	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3,
	.footer-widgets-4 {
		width: 100%;
	}
	
	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3 {
		margin: 0;
	}
}

Updated CSS to include responsive support. At 768px wide (iPad width), widget 2 and 4 are floated right, so the columns are in a 2x2 pattern. At 480px wide (smartphone width), widget width is increased to 100% so they are in a 1x4 pattern. Also cleaned up the code to conform to the Genesis CSS style.

Not finding this works for the media 480. I had to add a clear:both to get them to stack but they are staying in 25% columns (it's pulling from the primary footer CSS).

Works great. Thanks!

Good work.
Worked like a charm for me.
Thanks!

Hi, thanks for this! Set up seems to work as in there is a place for a 4th column frontend but it doesn't appear to have added a 4th widget area in the wordpress backend to add the actual content?

Hi, thanks for this! Set up seems to work as in there is a place for a 4th column frontend but it doesn't appear to have added a 4th widget area in the wordpress backend to add the actual content?

I had this same question and was able to fix on my end, using the genesis-sample theme, in config/theme-supports.php
Changed line 34 in my file:

'genesis-footer-widgets' => 3,
to
'genesis-footer-widgets' => 4,

Hi, thanks for this! Set up seems to work as in there is a place for a 4th column frontend but it doesn't appear to have added a 4th widget area in the wordpress backend to add the actual content?

Also add this css inside a min-width 960px media query - previously width was 100% divided by 3, just update that to 4.

	.footer-widget-area {
		float: left;
		margin-bottom: 0;
		width: calc(100% / 4);
	}

Currently working on the Genesis Framework Genesis Sample child theme.