How do I disable a section on mobile only?
Hide a section on smartphone without modifying the desktop version
Key points • Hiding a section on mobile is possible via the Designer • This operation does not affect the desktop or tablet display • Ideal for reducing page load times and improving mobile readability • A responsive check is essential after modification
Some sections work perfectly on a computer but become too heavy, unreadable or useless on mobile: complex carousel, large image, rich animation, banner too tall… Good news: you can disable a section only on mobile without affecting the desktop or tablet versions of your hotel site.
Here's how to do it effectively.
Disable a section on mobile via the Designer (recommended method)
To hide a section only on mobile, the Designer offers total control.
Procedure :
- Open the Designer.
- Select the section you wish to hide.
- At the top of the interface, switch to Mobile Portrait or Mobile Landscape mode.
- In the right-hand panel, locate the display icons (eye, visible/invisible).
- Click the icon to disable the mobile-only section.
- The section becomes invisible only for this breakpoint.
- Publish.
💡 Note: the section remains visible in the Designer, greyed out on the breakpoints where it is deactivated, which allows it to be reactivated at any time.
Verify that the correct section is selected
Sometimes the wrong element is hidden (e.g., an internal container instead of the entire section). Make sure that: • You select the entire section, not just an internal block • The visibility icon is applied to the entire element • The displayed breakpoint is the one shown on mobile
Tip: Select the section in the Navigator View to avoid errors.
When should this option be used?
Disabling a section on mobile only is useful when: • The image or carousel disrupts the layout • The animation slows down scrolling • The text is too long or too cramped • A section is not relevant on mobile (e.g., large gallery, detailed map, complex table) • You want to simplify the page to improve speed
Possible alternatives
Depending on your needs, you can also: • Create a specific mobile version • Replace a large image with a mobile-optimized version • Reduce the content instead of hiding it completely • Hide only part of the content (e.g., the image but keep the text)
This allows information to be retained while optimizing the mobile experience.
Pay attention to empty spaces and responsiveness.
After disabling a section on mobile: • Check that no empty spaces remain • Adjust margins and padding if necessary • Check the rendering on multiple devices (iPhone, Android) • Confirm that the content flow remains logical
💡 A hidden section can change the visual balance of the page: always test the scrolled version of the page.
Best practices for a hotel website
To ensure an optimal experience: • Maintain a mobile-first design • Use lightweight sections at the top of the page • Avoid complex carousels on smartphones • Ensure that CTAs remain accessible • Always test text readability on small screens
Conclusion
Yes, you can disable a section for mobile-only use in just a few clicks via the Designer. This method allows you to streamline the mobile version, improve readability, and ensure a comfortable experience for visitors to your hotel website. By carefully testing the rendering after modification, you guarantee smooth and consistent navigation.