Can you change the number of footer widgets?

Resolved sanuja
(@sanujacom)

3 years, 9 months ago

I tried to add just one footer widget to the theme, but it looks like the footer is broken down to four widget sections. Is it possible to have one single footer widget that go across the bottom of the page (just above the “site-info” CSS class?

If this cannot be done simply with CSS, can it be done with a child theme with footer.php? Will it break something else on the this twenty fourteen theme?

Also, is there a Child Theme template for twenty fourteen I can simply download and install?

Thank you.

The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

Michael
(@alchymyth)

3 years, 9 months ago
you can change the layout of the footer widgets with CSS;
for example, set the first footer widget to be full width, and all others to 25% as originally…

add to ‘Additional CSS’:
```
/*CSS for first footer widget full width, consecutive widgets four in a row, large screens only*/
@media screen and (min-width: 1008px) {

	/*set consecutive widgets to quarter width*/
	#footer-sidebar .widget { 
		position: relative!important; 
		left: 0!important; 
		top: 0!important; 
		width: 25%; 
	}

	/*set first footer widget full width*/
	#footer-sidebar .widget:first-child { 
		width: 100%; 
	}

	#footer-sidebar .widget:nth-child(6n) { 
		clear: both; 
	}

	.site-info { 
		clear: both; 
	}

}
```
Thread Starter sanuja
(@sanujacom)

3 years, 9 months ago

@alchymyth
Thank you so much for the CSS code. It works but it creates a large empty space between the widget content and .site-info copyright bar (which I have modified with CSS to replace with my own Copyright/Privacy link).

Is there a way to make the height of the widget responsive based on the widget content?

Thanks again.

Michael
(@alchymyth)

3 years, 9 months ago

difficult to tell, as the footer widget is not visible in your site.
can you add the widget and publish the site with it?

the test in my site with an unedited Twenty Fourteen did not show this problem.

Thread Starter sanuja
(@sanujacom)

3 years, 9 months ago

@alchymyth
Thank you so much for responding to me. 🙂

I just updated my website with the information I would like to see at the bottom of the screen. If you visit the website on a desktop computer (screen size), you will see that there is so much white space (like empty margin) at the top and bottom of the message. I would like to reduce that space to 0 or next to nothing.

You can actually see that empty space before and after the GDPR message even when I minimize the screen.

Thank you again.
Michael
(@alchymyth)

3 years, 9 months ago
the gap is caused by some original CSS of the theme;

you can overwrite this with:
```
div#footer-sidebar { 
  padding-top: 10px;   
  max-height: inherit!important; 
}

#footer-sidebar .widget { 
  margin-bottom: 10px; 
}
```
adjust the 10px to as large or as small as you like.

not tested with more than the one widget.

please get used to working with the ‘inspect’ feature available in most browsers, if you are not yet familiar with it
Thread Starter sanuja
(@sanujacom)

3 years, 9 months ago

@alchymyth
Thank you so much. It worked and I was trying to use Chrome F12 and trying to identify the classes and divs, but I got confused.

Thank you so much again.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Can you change the number of footer widgets?’ is closed to new replies.

Tags