Docs

[hwolfe]

I am using Renew stack. How can I extend the footer area so that it always covers up the site background image, no matter how little content is in a page?

See here: http://www.eightfoldfarms.com/events/new-years-eve-bonfire/

Thank you!

[hwolfe]

This reply has been marked as private.

[Rupok]

Hi there,

I am not sure how do you want to cover the background image. Would you clarify a bit with a screenshot?

Thanks!

[hwolfe]

See how in this screenshot the footer does not extend down and the background image shows? It’s only happening on the larger screen sizes.

[Nabeel A]

Hi again,

I think you need a sticky footer, Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding. Take care!

[hwolfe]

Okay, well now that I know it’s called a sticky footer, I searched “sticky footer” on the forum and found this code:

.site > .x-container.max.width.offset {
    min-height: calc(100vh - 397px);
}

It works on other pages (yay!), but not on my Events page. Any ideas?

Events

[Rue Nel]

Hello There,

Thanks for updating in! The code will not work because you do not have the necessary container. I would highly recommend that you edit your events template and find this line:

<div id="container">

This line needs to be replaced and make use of this line instead:

<div id="container" class="x-container max width">

Please let us know if this works out for you.

[hwolfe]

Okay, figured this out. It was a setting in the plugin. In case anyone else needs this info I am using Events Maker and I had to uncheck “Enable to use default templates” in EM settings under the Templates tab.

Thanks for helping, Themeco!

[Joao]

Glad to hear it,

Cheers

[Author]

Posts