Work with role-based layouts

When reviewing your storefront in Preview, you can use role-based layouts that render exclusively for selected roles.

The layout only renders in Preview if the user is authenticated and matches one of the designated roles.

Important: This feature works only in Preview mode. It cannot be used on a production storefront application.

Layouts of this type can be used in conjunction with any Commerce roles. For example, you can use this feature to preview a page exclusively for developers with the Design role, allowing them to test changes before they are made on the production storefront application.

To create a role-based layout:

1. Access the role-based layout from the Design page, Layout tab.
2. Navigate to the Role layout by using the filter options.
3. On the Layout Settings, Role Layout dialog, create a layout name, set the layout as the default layout (optional), and, if you are working with a cloned layout, select the applicable viewport(s).
4. Click the Role field to use the role picker functionality. You can select one or more roles for this layout.
   Note: If a role is not selected in the Role field, or if the selected role is deleted, the layout is not rendered in Preview, even if accessed by an administrator, agent, or agent supervisor role.
5. Name the role display name.
6. For a cloned layout, include the page address and display name if applicable.
7. Click Save.

Once you have completed configuring the settings, create the page for Preview as you would with any other layout, using grid view, components, and elements.