Outreach Pro change 4 columns to 3

[BlakeN]

Hi,

In the home-bottom widget area I am trying to get three columns instead of four.

http://directmktg101.com/ (you can currently see the three and blank space.)

Here are some of the threads that have been unhelpful:

Columns in the footer of 'Education'

Education Theme Featured Widgets with Different Column Widths

Is there a quick change that can be made to change only the home-bottom to three columns?

Any help is greatly appreciated.

http:// http://directmktg101.com

[Davinder Singh Kainth]

Backup before making changes.

1. In functions.php file look for following code

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

change this to...

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

2. Then in style.css file

Look for following code

.footer-widgets-1,
.footer-widgets-2,
.footer-widgets-3,
.footer-widgets-4 {
	width: 255px;
}

.footer-widgets-1,
.footer-widgets-2 {
	margin-right: 40px;
	margin-right: 4rem;
}

.footer-widgets-1,
.footer-widgets-2,
.footer-widgets-3 {
	float: left;
}

.footer-widgets-4 {
	float: right;
}

change this to...

.footer-widgets-1,
.footer-widgets-2,
.footer-widgets-3 {
	width: 340px;
}

.footer-widgets-1,
.footer-widgets-2 {
	margin-right: 40px;
	margin-right: 4rem;
}

.footer-widgets-1,
.footer-widgets-2 {
	float: left;
}

.footer-widgets-3 {
	float: right;
}

---

Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis Themes

[BlakeN]

Thanks Davinder.

I made all of the suggested changes and there are still 4 columns.

Do you know what else could need to be done?

[Davinder Singh Kainth]

Hi, I thought you wanted this for footer widgets. Please revert back above mentioned changes.

For 3 columns of home-widget section. Look for following code in style.css file

.home-bottom .widget {
	float: left;
	margin-left: 2.564102564102564%;
	width: 23.076923076923077%;
}

.home-bottom .widget:nth-child(4n+1) {
	clear: both;
	margin-left: 0;
}

Change this to...

.home-bottom .widget {
	float: left;
	margin-left: 2.564102564102564%;
	width: 31.623931623931625%;
}

.home-bottom .widget:nth-child(3n+1) {
	clear: both;
	margin-left: 0;
}

---

Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis Themes

[BlakeN]

That did it.

I really appreciate the help.

[Davinder Singh Kainth]

Cool.

---

Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis Themes

[ddavis]

Hi,
Thank you for this, I was able to use the above info on this site, http://www.tech-talk.com to change from four section to three. However, now the images for each don't stretch across the whole widget area. How can I change the code to make the images wider?

Thanks!
Deborah

[Author]

Posts