Preview and inspect components
The Component builder offers various ways to visualize the components.
When you are finished building a component, there are two modes available to view your components. In Inspect mode, hidden elements are visible but unavailable. In Preview mode, you can see the components as they will render on your webpage. If you have components with mapped data, you also choose to see all the components' layout repeats.
Preview layouts of components with mapped data
There are various ways you might want to see your components. For example, when a component has data mapped to it, you might want to see all repeated layouts of the component. Or you might want to see a component with the variables replaced by individual data.
To see all repeated layouts of a component with mapped data:
-
In the Preview or Inspect menu, switch on Show all data collection.
The repeated layouts are distinguished from the original one with diagonal grey striped backgrounds. You can only preview the repeated layouts; you can not edit them. However, all style changes on the original layout propagate directly to the repeated layouts.
To display a component showing data from the data source instead of the variables:
-
In the Preview or Inspect menu, switch on Display mapped data.
The Component builder is in Preview mode when you can see all the component layouts as they will render on your webpage. To be in Preview mode, the following three switches must be on:
-
Display mapped data
-
Show all data collections
-
Conceal hidden elements
When one or more of these switches is not selected, the Component builder is in Inspect mode.
