input-numericAX - Metric

Overview

AX - Metric is an Experience Cloud component that displays calculated values from Salesforce records—like totals, averages, counts, and other aggregations—on Experience Sites pages.

Use it to show portal users key metrics at a glance, such as their total orders, average case resolution time, open ticket count, or any custom calculation derived important numbers at a glance, such as their total orders, average case resolution time, open ticket count, or any custom calculation from their data. Configure the metric label, icon, formatting, and data source in Experience Builder without code.

Perfect for portal dashboards, account summaries, performance scorecards, or anywhere portal users need to see key numbers about their records without running reports.


Getting Started

Use this simple tutorial to learn the basics of the Metric component and start building your use cases.

spinner

Configuration Options

Label

Provide a descriptive label for your metric (e.g., "Total Sales," "Active Users"). This serves as a title, giving context to the displayed value.

Description

Offer additional context or insights related to the metric. This can be a brief explanation, a trend description, or supporting information to enhance understanding.

Value

Enter the metric's primary numerical value. You have two options:

Manual Input

Directly enter the value if it's readily available.

Query

Leverage the power of Salesforce Object Query Language to dynamically fetch the value from your Salesforce data. For example, you can calculate the total number of accounts created this year using a query on the Account object.

Example: Counting New Accounts Created This Year

Secondary Value

Display an additional metric for comparison or further context. This can be the value from a previous period, a target value, or any relevant secondary data point.

Prefix & Suffix

Add symbols or abbreviations to provide context. For example, use "$" for currency, "#" for quantities, or "K" for thousands.

Tooltip

Offer more details on hover. Briefly explain the metric or provide additional insights.

Avatar

Visually represent the metric with an image, initials, or icon. This makes the metric more recognizable and engaging.

Primary & Secondary Metric Formatting

Fine-tune how your metric values are displayed:

  • Format Style: Decimal, currency, percentage - choose the best format for your data.

  • Value Sign: Auto, positive, negative - control how signs are displayed.

  • Digits: Specify the minimum and maximum number of integer and decimal digits.

  • Significant Digits: Round to a specific number of digits for readability.

  • Show Trend Color: Use color to instantly indicate positive (green) or negative (red) trends

With its flexibility and range of options, the Avonni Metric component empowers you to present complex data in a simplified and impactful way, making it a valuable asset for any Experience Cloud site seeking to provide actionable insights to its users.


Use Case Examples

Example 1: Account Won Opportunity Amount

spinner

Put total closed-won revenue front and center on every account page, giving partner users an immediate view of the relationship's value without leaving the record.


What You'll Achieve

  • Rolled-up revenue visibility: Display a real-time sum of all closed-won opportunity amounts tied to the account, giving partners instant insight into customer value.


How to Set It Up

1

Add the component to your page

Drag the AX – Metric component into Experience Builder on your Account detail page.

2

Configure the data source

  • Click into the Value field and set up a query using the following settings:

    • Object API Name: Opportunity

    • Field: Amount

    • Aggregate Function: SUM

3

Apply filters

Scope the query to the current account and winning deals only:

  • Account ID: {!Item.Id}

  • Stage: Closed Won

4

Customize the display

  • Set the Label to Won Amount

  • Set the Avatar Icon to standard:opportunity

5

Preview your component

  • Use the Experience Builder preview to confirm the metric renders correctly before publishing.


address-cardAX - Profile Cardchevron-rightbars-sortAX - Record Detailchevron-right


Example 2: Account Open Cases

spinner

Give partner users a live count of unresolved cases directly on the account page, so they can quickly gauge support load and prioritize their outreach accordingly.


What You'll Achieve

  • Open case count at a glance: Surface the total number of active cases linked to an account, helping partners stay informed on customer health without navigating to a separate list.


How to Set It Up

1

Add the component to your page

Drag the AX – Metric component into Experience Builder on your Account detail page.

2

Configure the data source

  • Click into the Value field and set up a query using the following settings:

    • Object API Name: Case

    • Field: Id

    • Aggregate Function: COUNT

3

Apply filters

  • Scope the query to the current account and open cases only:

    • Account ID: {!Item.Id}

    • Closed: false

4

Customize the display

  • Set the Label to Open Cases

5

Preview your component

  • Use the Experience Builder preview to confirm the count renders correctly before publishing.

Last updated

Was this helpful?