Dynamically display content with conditional renderers
Use the conditional renderer component to display content or components based on specified conditions.
Before you begin
Role required: ui_builder_admin
Procedure
Navigate to All > Now Experience Framework > UI Builder.
Open an experience to work in or create an experience by selecting Create > Experience.
See Configure how users interact with your applications in UI Builder for more information on creating experiences.
Create or open a page or page variant.
For more information about how to create a page in UI Builder, see Create a page in UI Builder.
Select + Add content in the content tree.
Select Components.
Select Conditional renderer.
Select + Add condition.
Choose how you want to build the condition.
Type of condition Description Empty Container Create a condition by placing components in an empty container. Card Create a condition by placing components in a card component. Single component Add a condition directly to a component without using a container or card. This works well for showing a single component only when the condition is true. Select a component from the list if you selected Single component in the previous step.
On the form, fill in the fields.
Field Description Component label Label to identify the conditional content. Component ID Unique identifier used when binding data. Description (Optional) Description of the condition. Render content Select when to render the content on the page. Condition Use data or formulas to set the condition for rendering content. The field requires a true boolean value. Select Apply.
Add components to the container or card.
For more information about adding components, see Customize UI Builder pages using components.
Configure the components in the conditional renderer.
Select Save.
Parent Topic:Customize UI Builder pages using components