Record Detail


The Avonni Record Detail component is your go-to tool for displaying detailed information about specific Salesforce records directly on your Experience Cloud site. Whether showcasing customer details, displaying opportunity information, or highlighting any other Salesforce object, this component offers flexibility and customization to integrate record data into your site's pages seamlessly.

Configuration Options

Object Name

Specify the Salesforce object you want to display (e.g., Account, Contact, Opportunity, Case). This determines the type of record the component will fetch and present.

Record ID

Provide the unique identifier of the specific record you want to display. This ensures the component retrieves and displays the correct information.


Imagine you want to add the Record Detail Component to a page about a specific account. To show the details of that account on the page (instead of just any random account), you'll need to use a special Experience Cloud expression. This tells the component to dynamically display the details of the account that the user is currently viewing.


Read Only (Toggle)

Choose whether users can edit the displayed record data directly on your Experience Cloud site. Enable this option for a static, informational view, or disable it to allow users to update record details.


Select a layout style:

  • Full: Displays all available fields in a detailed format, perfect for seeing everything.

  • Compact: Shows only the most important fields to save space, ideal for quick overviews.

  • Custom: Tailor the layout to your specific needs. Handpick which fields to display and arrange them in your desired order

Number of Columns

Define how record fields are arranged across the component. Choose multiple columns for a structured, tabular layout or a single column for a streamlined, vertical presentation.


Control the spacing between elements in the component for optimal readability:

  • Comfy: Provides generous spacing for a relaxed reading experience.

  • Compact: Uses tighter spacing for a more condensed view.

  • Auto: Automatically adjusts spacing based on screen size and available space.

Last updated