Hey (Ladies and) Guys ,
as it seems there is no real out-of-the-box responsive Color-Section-Background Solution. – Also according to the entries in this forum, everything seems to be just a specific work-around.
In my current case i have a Color Section which is 100% (content-width) and has 1/1 Section inside, that only contains a Textfield with a H1-Title.
Now, for the Options:
a) Color Section is not responsive. Whatever i tried i could not manage to have the image fully visible in a way, that it still was underneath the title when switching to mobile (it appears to be half empty).
b) Full-Width-Slider seems not to have a way to have a custom Layer on it – does it?
c) Layer-Slider seems to provide the solution as it resizes the background responsive and also keeps the layer on it.
Now the major question: Is there any experience on having a H1 on a LayerSlider in regards to search engines? Will the document structure still be valid with this solution?
Many thanks in advance!
Cheers
– onlylettersandnumbers
– Private content is only to get an idea of what i mean
Hey onlylettersandnumbers,
Thank you for using Enfold.
a-b.) The color section has to preserve the aspect ratio of the background image so the image will look different or is not going to be fully visible on certain screen sizes, specially small ones. If you want to adjust the size of the background image on different screen sizes, try to apply a unique Section ID to the color section and then add a few css media queries to change the url of the background-image property.
c.) Yes, you can use the layer slider and place the h1 tag as a layer. Make sure that it is the only h1 tag in the page if you’re concern with the structure.
Best regards,
Ismael