Experience Sites Integration

Overview

Your Dynamic Components work on Experience Cloud sites just like they do on internal Lightning pages. You build your component in the Dynamic Component Builder, activate it, then add it to your site pages through the Experience Builder.

---

How to Add Dynamic Components to Your Site

1

Build and activate your component

Create your Dynamic Component in the Component Builder, save it, then click Activate. Without activation, it won't appear in the Experience Builder.

2

Add it to your site page

1. Open your Experience Cloud site in the Experience Builder

2. Navigate to the page where you want to add your component

3. In the Components panel (left side), find "AX - Dynamic Component" under the Custom section

4. Drag it onto your page

For Legacy Package Installations

If you installed the legacy standalone Dynamic Components package (instead of the Avonni Experiences Components package), look for "Avonni Dynamic Component" in the component list, not "AX - Dynamic Component."

3

Choose which component to display

Select the component you just placed on the page. In the Properties Panel on the right, you'll see:

Component Name: Select which Dynamic Component you want to display from the dropdown. If your component doesn't appear, make sure it's activated in the Component Builder.

Record ID: On record detail pages (like Case Detail or custom object pages), enter {!recordId} to pass the current record's ID to your component automatically. Your component can then use $Component.recordId to display the correct data.

Object Name: Enter {!objectApiName} to pass the object's API name to your component, giving it additional context about the page.

Two Ways to Use Avonni in Experience Cloud

Dynamic Components (what this guide covers)

Build complex, custom solutions—like a filterable data table, Kanban board, or metrics dashboard—then place the entire custom component on your site page. Best for advanced, interactive use cases.

Pre-Built Experience Site Components

Use our library of 40+ individual components (Map, Gallery, Image List, etc.) that you can drag directly onto pages. Best for simpler needs where you want a quick, pre-made element.

You can use both on the same site! Use pre-built components for simple tasks and Dynamic Components for custom, complex experiences.