Responsive Visibility not working on Banner (Foundry)

Hi,

Have tried to set two banners (one for mobile and one for tablet/desktop) using the inbuilt RW responsive area and the visibility stack in Foundry, but both types are not working. The website is ending up with two banners being displayed on both Mobile and Desktop. Can anyone suggest a work around or fix?

I’ve just done an experiment with this and it worked. I didn’t put the banners inside any other stack.

I made a blue banner and a pink banner. The blue banner is set to display on tablet and desktop, the pink on mobile only.

Blue banner settings

Pink banner settings

I hope that helps

2 Likes

I think what @kerrodc is likely running into is that they’re using the Banner in Hero mode for the desktop and tablet breakpoints.

Hero banners are a bit different than other banners. To make it fill the screen the Hero Banner is taken out of its original stack and placed at the top of the page’s hierarchy. This means that when it is removed from its stack it is also removed from parent stacks as well. In this case the Visibility stack you’re using to hide it at certain breakpoints. Since it isn’t in the Visibility stack any longer it won’t be hidden at those breakpoints.

1 Like

@elixirgraphics - thanks for your response, if I used something like Joe Workmans Agent stack that controls visibility on the server level will it still have the issue with the Hero Banner displaying twice?

1 Like

@kerrodc I don’t have any experience with the stack you’re referring to, unfortunately, so I can’t say.