Prior to this update, all page editing in the builder was performed in the Desktop view, with the ability to Preview changes on Desktop, Tablet and Mobile views. The new builder modes customization feature allows for editing of page blocks and content on Desktop, Tablet and Mobile views directly in the editor!

Desktop mode is the default and where adjustments of main settings for elements is performed, such as setting a destination for buttons/images, adding a link for text or adding an embed code for a video.

Edit modes for Tablet and Mobile are currently style-related, allowing to adjust the style of elements and blocks on each device type. So that you can optimize the appearance of blocks and elements on each device type used to view your page, edits in each different mode are independent from one another.

To start editing in Tablet or Mobile modes, just click on the desired icon at the top of the builder (1) or on the "Edit on" icon in the left sidebar menu (2):

📝Builder modes customization is currently only available for buttons, images, videos, block appearance and text. More elements customization will be added soon.

To edit an element (button, image, video or text) within a block, click on the element in the builder to open the left sidebar panel where the settings are located.

Using the "button" element as an example, there you can choose which mode to edit in (1), set the button's CTA text and styles (2), set the Destination for the button (3), adjust the button styles (4) and the button settings (5):

When switching to Tablet or Mobile edit modes, only the appearance of the button can be adjusted on each device type independently. Main button settings are available in Desktop edit mode only.

To edit a block, click on the "Block Appearance" button in the top right corner of the block (1) or on the background of the block directly (2) to open the left sidebar panel where the block appearance settings are located:

There you can choose which mode to edit in (1), choose which device(s) the block is visible on (2), adjust the layout of the block (3), and edit the block's background settings (4):

When switching to Tablet or Mobile edit modes, only the Visibility and Layout settings will be available so you can adjust the appearance of the block on each device type independently:

If a block is hidden on a particular view, then a device icon will be shown in the top-left corner of the block indicating which device(s) the block is hidden on: