[Resolved] Page Header/Sections Background Image Question…

[Coulter]

I’ve been playing with the “Page Header” and “Sections” add-on. One thing I’ve noticed that’s a little frustrating is how the container does not automatically adjust to the image height. Instead, I am forced to guesstimate the container size by adjusting the padding until the height is generally similar to the image.

Here are the steps I’m taking (similar in both Page Header & Sections)

01. Add Background Image – Sized the way I want it.
02. Add Content (i.e. <h1>This is some content</h1>)
03. Set “Container Type”/”Box Type” to Contained.
04. Hit “Update”.
05. Check page. The container width is fine, but the height is sized to the H1 Element + Whatever Padding/% was selected.
06. Go back and forth, adjusting the Padding/% and updating until the full image height is displayed.

Am I doing something wrong? Is there a way for the container to automagically size to my image, without having to tweak the padding every time?

Thanks!

[Tom]

Hi there,

This is just how background images work in HTML/CSS unfortunately. The element has no idea the image is there, as it’s not a static image inside of it.

[Susanne]

Hi there,
tagging on to this post because I am dealing with the same problem.
Would it be possible to size the featured image instead ( which is not a background image) and then move the page title on top of that?
I seen it work here
http://silvercoastpartners.com/our-services/
different theme but same idea: feature image and the title is on top.
Would I have to disable the page header image for that?

[Leo]

Hi there,

The new page header add-on in GPP 1.4 allows you to do that easily.

Check it out here: https://vimeo.com/223381628

In should be released in the next couple days but if you want to test it out then you can become a beta tester: https://docs.generatepress.com/article/beta-testing/

[Susanne]

I am all over that! Thanks!

[Leo]

No problem!

[Author]

Posts