Responsive Behavior
Hero Image PLUS provides responsive controls for backgrounds, groups, element widths, visibility, and parallax.
Mobile Breakpoint
The built-in mobile layout is applied below 768 pixels.
Mobile Background
When a mobile background image is selected, it replaces the desktop background below the mobile breakpoint.
When no mobile image is selected, the desktop image remains active.
Group Mobile Behavior
Each group supports:
- Keep desktop layout
- Stack elements
- Stack elements in reverse order
Stacked groups change to a vertical direction on mobile.
Element Width
Every content element supports:
- Automatic
- 25%
- 33%
- 50%
- 66%
- 75%
- 100%
On smaller screens, the frontend allows responsive wrapping and full-width behavior where necessary to prevent unusable narrow elements.
Element Visibility
Every content element supports:
- Always visible
- Hide on mobile
- Hide on desktop
Use visibility controls carefully. Essential information and navigation should not be available on only one device class.
Content Spacing
A horizontal or vertical content-spacing value of 0 uses responsive defaults.
Large fixed desktop spacing values are reduced by the responsive stylesheet where necessary so content remains usable on smaller screens.
Mobile Parallax
Parallax is disabled on mobile unless the block option explicitly enables it.
Reduced-motion preferences disable it on every device.
