Tablet and Mobile layouts are created for each page of the project individually. Once enabled, you need to reconfigure the same widgets you created on the desktop version within the corresponding grey frame. This allows visitors using a tablet or mobile device to view an adjusted version of the page instead of the automatically scaled desktop layout shown by default (when Tablet or Mobile views are disabled).
The content of your widgets is synchronized between desktop, tablet, and mobile layouts so any revisions to text, pictures, links, or videos register in every version. However, some attributes—such as size, color, font styles, animations, etc.—can be changed independently in different layouts.
All widgets exist in all three layouts. When you add a new widget to the mobile layout a hidden copy is created on the desktop. To alter the content between the layouts—e.g., to create different texts for desktop and smartphone visitors—you can copy the widget, edit it separately, and then hide the duplicated widget for a particular layout.
If a widget is used in different layouts simultaneously, you will see a Desktop or Mobile icon when you hold your cursor over it. For example, if you are editing the desktop version and see the Mobile icon next to a widget, this means it also exists in the mobile version of your project.
When editing the mobile layout, use the Desktop keyhole feature to check how your widgets look on the Desktop. To do so, select a widget and click Desktop Keyhole. This feature allows you to easily track changes in case of unexpected consequences to your desktop or mobile layout.