Hide or Show Components for Mobile

Some components are designed specifically for mobile devices. To ensure a seamless experience for your desktop and mobile users, choose to hide or show components depending on the type of device they are using.

The highlighted area in this flow shows where you are in the process of setting up your site:

Illustrates the Experience site workflow with the fourth step highlighted.

You also might not want your policyholders to have all of the same functionality that they have on a desktop on their mobile device.

The templates are configured with both desktop and mobile components. The mobile components hide automatically when viewed on a desktop device, but desktop components need to be configured to hide on mobile.

In the Experience Builder, click the View Mode menu.
Select Mobile.
Click OK on the Welcome to You Mobile Workspace window.
Open the Page Structure.
Select a component designed for desktop, then click Hide On Mobile.

This hides the component.

Tip Look for duplicate component names in the Page Structure while viewing in mobile. This is an easy way to see which components have different versions for desktop and mobile.
The page updates. The icon changes to in the Page Structure.

Tip You can click to show a component if it is hidden.
Repeat this process for all components that have a mobile and desktop version.