Display Conditions
Display conditions are a feature that allows elements within dynamic (CMS) lists or dynamic pages to be shown only under specific conditions. This functionality enables you to toggle the visibility of elements based on the state of your content.
This article explains the overview and setup process for display conditions.
How Display Conditions Work and Their Types
Display conditions are set based on CMS properties.For example, if you want to "display a 'NEW' badge on blog posts published within the last week," you'll use the "Publication Date" property to specify the display period from that point.
Available display condition types:
Property | Condition Type | Property Status |
All properties (except publication date/time) | is set | Shows when the target property is configured |
All properties (except publication date/time) | is empty | Shows when the target property is not configured |
Reference property | is | Shows when the target property matches the specified value |
Reference property | is not | Shows when the target property does not match the specified value |
Publication date/time property | from ~ , days/weeks/months/years | Shows when the target property falls within the specified period |
Types of Conditional visibility
1. "is set" and "is empty" Conditions:
By setting these conditions, you can toggle the visibility of elements based on whether a specific property is set for a CMS item.
Use Cases:
Display a registration button only for ongoing events.
Display a "SALE" badge only for sale items.
Available Properties:
Reference Property (Single Select)
Text Property
Image Property
Numeric Property
Boolean Property
For Boolean properties, the conditions appear as "is True" or "is False."
2. "is" and "is not" Conditions:
These conditions can only be set for reference properties (single select) and select properties. By setting these conditions, you can display elements when they match (or do not match) a specific value.
Use Cases:
Display a badge only for articles by a specific author.
Show elements for articles that are not in a specific category.
Available Properties:
Reference Property (Single Select)
3. "from ~ , days/weeks/months/years" Condition (Publication Date/Time Property Only)
This condition can only be applied to publication date/time properties.
Elements will be displayed only during the specified period, starting from the CMS item's publication date and time. Once the specified period expires, the element automatically becomes hidden.
For detailed setup instructions, please check out How to Display a "NEW" Badge on CMS Items During a Specified Period.
Use Cases
Display a "NEW" badge on blog posts published within the last week
Show a badge on limited-time price items for just 3 days
Tips: Publication date/time and last update include the exact time.
For example, if an element has display conditions set as follows, it will become hidden at 15:30 on December 27, 2024, when it no longer meets the condition:
Item published on December 20, 2024, at 15:30
Display condition set to 1 week from publication date/time
Available property:
Publication date/time
Use Cases
This feature can be utilized in scenarios such as:
Displaying an application button only for events that are currently in progress on event listings or detail pages
Showing a "NEW" badge on blog post listings or detail pages for posts published within the last week
Displaying a "SALE" badge only on sale items in product listings or detail pages
How to Set Display Conditions
Select an element.
In the editor, select the element within a CMS list or dynamic page that you want to show or hide under specific conditions.
Open display conditions.
Open the box settings panel on the right side of the screen.
Select a property.
Click on the input field labeled "Set display condition" and select the property that will determine your condition.
Configure the display condition.
Note: If properties don't appear in the options
Multi-select reference properties cannot be used as display conditions. Please verify that your property is not set as a "multi-select reference property."
If it's a multi-select, you'll need to delete the property and reconfigure it as a single-select.
5. Verify functionality.
Check that everything works correctly using Live Preview or on your published site.
How to Remove Display Conditions
To remove a setting, click the "×" to the right of the display condition.
