---
schema_version: "1"
id: 620ca79c4eff1f30b9ced33b9d6bad42ed6af2c59218265297f9b7847dacbef6
title: Build an Expression-Based Visibility Rule in LWR Sites Using Custom Logic
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/experience/264-0-0/exp_cloud_create_custom_logic_expression.md
canonical_url: https://help.salesforce.com/s/articleView?id=experience.exp_cloud_create_custom_logic_expression.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 7111b0abf7c88b0f53cdafbbcd22c6826109e15abe024139770701cd9917211d
description: Build your own custom logic to show or hide a component or component variation. Create a custom logic expression by adding your conditions for component visibility.
products:
  - Experiences
release: "264"
---
# Build an Expression-Based Visibility Rule in LWR Sites Using Custom Logic

Build your own custom logic to show or hide a component or component variation. Create a custom logic expression by adding your conditions for component visibility.

### Required Editions

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small edition"><colgroup><col></colgroup><tbody><tr class=""><td class="slds-cell-wrap" style="vertical-align:top;">Available in: Salesforce Classic and Lightning Experience</td></tr><tr class=""><td class="slds-cell-wrap" style="vertical-align:top;">Available in: <strong>Enterprise</strong>, <strong>Performance</strong>, <strong>Unlimited</strong>, and <strong>Developer</strong> Editions</td></tr><tr class=""><td class="slds-cell-wrap" style="vertical-align:top;">Applies to: <a href="https://help.salesforce.com/s/articleView?id=experience.exp_cloud_basics_glossary.htm&amp;type=5&amp;language=en_US" target="_blank">LWR sites</a></td></tr></tbody></table>

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small permission">
        <colgroup>
          <col style="width:50%">
          <col style="width:50%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="colgroup" class="slds-cell-wrap" colspan="2" style="text-align:center;vertical-align:top;" id="d70482e79">User Permissions
              Needed</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="User Permissions Needed" class="slds-cell-wrap" style="vertical-align:top;" headers="d70482e79 ">To create an Experience Cloud site:</td>

            <td class="slds-cell-wrap" style="vertical-align:top;" headers="d70482e79 ">Create and Set Up Experiences AND View Setup and Configuration</td>

          </tr>
          <tr class="">
            <td data-label="User Permissions Needed" class="slds-cell-wrap" style="vertical-align:top;" headers="d70482e79 ">To customize or publish an Experience Cloud site:</td>

            <td class="slds-cell-wrap" style="vertical-align:top;" headers="d70482e79 ">
              <ul>
                <li>Create and Set Up Experiences AND View Setup and Configuration AND be a member
                  of the site<p>OR</p>
                </li>

                <li>View Setup and Configuration AND be a member of the site AND have appropriate
                  <a href="https://help.salesforce.com/s/articleView?id=experience.networks_access_control_overview.htm&amp;language=en_US" target="_blank">role-based site access</a>
                </li>

              </ul>
            </td>

          </tr>
        </tbody>
      </table>

You can create visibility rules for any component in Experience Builder from the Visibility tab. Before creating a custom logic expression, add and specify the conditions. When you add a condition, it’s numbered. Your first condition is numbered 1, the second is numbered 2, and so forth. Use these conditions to build your expression.

1. From Experience Builder, select a component that appears on the canvas.
2. From the Visibility tab, click **\+ Add Visibility Rule**.
3. From the Component State dropdown, choose to show or hide the component.
4. To add a condition for the logic, click **Add Condition**. Choose values for all the conditions that you add.
    
    Add at least two conditions.
5. From the When dropdown, select **The Custom Logic Is Met**.
6. In the Custom Logic field, enter your custom logic expression.
    
    Consider these criteria when you build a custom logic expression: Include at least 2 conditions, use all the added conditions, and use only AND and OR operators.
7. Save your work.

![Example](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-experience-communities-264-0-0-production-enus/bf7df212-91a1-4fa3-a007-4d6f3e3b470b/images/icon_example.png)

Example

Consider a scenario where you add three conditions: 1, 2, and 3. Your custom logic expression can be `1 AND 2 OR 3`. In this case, your component or variation would appear when the conditions 1 and 2 are met, or when only condition 3 is met.

Another scenario: Consider the logic `((1 OR 2) AND (2 OR 3))`. In this example your component would appear when either condition 1 or 2 is met AND condition 2 or 3 is met.