Point: What is a List?
A List lets you manage a group of boxes that share the same layout.
You can manage data such as text and images all in one place. And if you connect it to a source like Studio CMS, it becomes a dynamic list that automatically reflects any updates you make. By default, a list works as a static list.
For the property types available and how to manage them, see Lists: List Properties.
How display conditions work and the types available
Display conditions for static lists let you show or hide elements for each item, based on whether a list property has a value.
Display conditions are set based on list properties. Here are the available combinations of properties and condition types.
Property | Condition type | Property state |
Text, image, and URL properties | is set | Shown when the property has a value |
Text, image, and URL properties | is empty | Shown when the property has no value |
Boolean property | is True | Shown when the property is on |
Boolean property | is False | Shown when the property is off |
Tip: For step-by-step instructions using a Boolean property, see Lists: Show or hide the container box for each item.
"is set" and "is empty" conditions
With "is set" and "is empty," you can show or hide an element based on whether the specified property has a value for a list item.
Use cases:
Show a caption area only on items where the "Caption" text property has been filled in
Show alternative text on items with no "Thumbnail" image property, and the image on items that have one
Show a "Learn more" button only on items where the "Detail page link" URL property is set
Available properties:
Text property
Image property
URL property
For details on each property, see Lists: List Properties.
Set a display condition
Select the element you want to set a display condition on. Choose an element inside the list that should appear (or not appear) only under certain conditions.
In the right panel, select the [Settings] tab. If the panel is closed, open the right panel.
Click the [Set display condition] field and select the property to use as the condition.
Select the condition. The available conditions change depending on the property type.
Check the result.
Change the property value in the property table and confirm that the box appears and disappears as expected.
Open Live Preview and confirm that it displays correctly.
Check the published site. Once everything looks right, update the site from the publish panel. Changes won't appear on the published site until you do. If the site is already live, see Update your site.
Remove a display condition
In the Design Editor, select the element whose display condition you want to remove.
In the right panel, select the [Settings] tab. If the panel is closed, open the right panel.
Click the "×" to the right of the display condition to remove it.
