---
sourceDocument: Australia Build or modify applications
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/application-development

 Release :

    - australia

ft:locale :

    - pt-BR

ft:publication_title :

    - Australia Build or modify applications

ft:clusterId :

    - cadev

bundleId :

    - cadev

workflow :

    - Development, Data, and Analytics


---

# Dynamically display content with conditional renderers

# Dynamically display content with conditional renderers {#ariaid-title1}

* Versão de lançamento: Australia
* 
* Atualizado 12 de mar. de 2026
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 min. de leitura

Use the conditional renderer component to display content or components based on specified conditions.

## Antes de Iniciar

Role required: ui_builder_admin

## Procedimento

1. Navigate to AllNow Experience FrameworkUI Builder.
2. Open an experience to work in or create an experience by selecting CreateExperience.  
   See [Configure how users interact with your applications in UI Builder](https://servicenow-prod.fluidtopics.net/dUVGdKGQs6AbFNSw~vNKcQ "Learn what an experience is in UI Builder. Understand what an experience contains.") for more information on creating experiences.
3. 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](https://servicenow-prod.fluidtopics.net/SclXrv5libg5iBN91G7scQ "Create a page in UI Builder for a portal, workspace, or custom application so that you can build a web experience for your users.").
4. Select + Add content in the content tree.
5. Select Components.
6. Select Conditional renderer.
7. Select + Add condition.
8. Choose how you want to build the condition.  
   {#conditional-renderer__table_ekc_q3n_b2c__entry__2}

   | 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. |
   [ ]

   {#conditional-renderer__table_ekc_q3n_b2c}
9. **Opcional:** Select a component from the list if you selected Single component in the previous step.
10. On the form, fill in the fields.  
    {#conditional-renderer__table_z2p_2mn_b2c__entry__2}

    | 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. |
    [ ]

    {#conditional-renderer__table_z2p_2mn_b2c}
11. Select Apply.
12. **Opcional:** Add components to the container or card.  
    For more information about adding components, see [Customize UI Builder pages using components](https://servicenow-prod.fluidtopics.net/xCm7DYJv1VhfgAuiOBoijQ "Learn what a component is in UI Builder. Also, see how components work within UI Builder.").
13. Configure the components in the conditional renderer.
14. Select Save.