Return to previous page

DIfferent banners on desktop and mobile - by Bas Kling

This topic has 7 replies, 2 voices, and was last updated 3 years, 10 months ago ago by Bas Kling

Bas Kling

Participant

September 6, 2021 at 20:59

Hi,

We’re struggling to get 2 different banners on our home page: horizontally oriented (stretched from left to right) on desktop and vertically oriented (full screen) on mobile.

By using Xstore’s slider, both seem to work fine, but as soon as we check (out) the visibility checkbox in column settings-> responsive tab on the row for desktop to make it disappear on mobile, and vise versa, the space reserved for that content seems to remain, due to ‘full height’ option in row settings. We don’t know of any other way to stretch the banner picture to full height on mobile. Can you please assist?

Logging in to the website’s test page should make the situation clear. URL in private

EDIT 1: all we need is a means to display a left-to-right stretched image on desktop, perhaps with some text over it, and a full screen (left-to-right & top-to-bottom) image on mobile. Not sure if the slider is the best way to achieve it.

EDIT 2: we’ve tried a different option – (responsive) image gallery at the bottom of the page, but we can’t get rid of the margins and paddings

Please, contact administrator
for this information.

#301470 Copied Theme version: 8.0.6

6 Answers

Olga Barlow

Participant

September 8, 2021 at 18:32

Hello,

Link to page that you provided displays 404. Provide us with the correct link, please.

Regards

#301687 Copied

Bas Kling

Participant

September 8, 2021 at 18:46

Link is set to Private, not to mess up google analytics (copy of home page would f*ck up our stats). Please log in using your credentials als admin to open link.

#301688 Copied

Olga Barlow

Participant

September 9, 2021 at 17:47

Hello,

I see. Ok but would you be so kind to send us an admin pass again because the previous one does not work for me, unfortunately.

Regards

#301809 Copied

Bas Kling

Participant

September 9, 2021 at 20:06

In private

Please contact administrator
for this information.

#301822 Copied

Olga Barlow

Participant

September 10, 2021 at 13:33

Hello,

Add the custom classes for the row to hide it for the mobile https://prnt.sc/1rpk7zj and these classes to hide for the desktop https://prnt.sc/1rpkc7x

Check that page now.

Regards

#301887 Copied

Bas Kling

Participant

September 10, 2021 at 16:44

Works like a charm. I think it’s because of the “full height” parameter in the first row, that messed things up. You can hide it in the WP bakery provided settings, but the space remains.
Your work around is perfect. Thanks!

#301922 Copied
Viewing 7 results - 1 through 7 (of 7 total)