circle-playAX - Audio

Overview

AX - Audio is a Lightning App Builder component that embeds audio players directly on your record, app, and home pages.

Use it to add audio content like training materials, voice messages, product demos, or announcements right where users work in Salesforce. Configure the player's appearance and controls in App Builder—no code required.

Key Features

  • Supports MP3, WAV, and OGG formats

  • Customizable playback and display options

  • Integrates audio into records and dashboards

Use Cases

  • Product Page: Embed sound samples for audio equipment or voice-over demos.

  • Training Record: Add audio instructions linked to training modules.

  • Customer Record: Play voicemail recordings or support call summaries.

  • Internal Announcements: Share audio updates or leadership messages.

  • Learning Hub: Include audio tips or reminders for employees.

  • Marketing Portal: Feature promotional jingles or audio ads.

Configuration

Add the Audio component to a Lightning page in App Builder, then configure it in the Properties Panel.

Basic Properties

These control the audio file and its playback behavior.

Property
Type
Description
Example

Audio Url or Content Document Id

String

URL or ContentDocumentId of the audio file (supports MP3, WAV, OGG).

https://example.com/audio.mp3 or 069XXXXXXXXXXXX

Auto Play

Boolean

Starts playback automatically if true (use cautiously for accessibility).

false

Loop

Boolean

Replays the audio automatically if true.

false

Hide Controls

Boolean

Hides player controls (play, pause, volume) if true for a cleaner look.

false

Display as Card

Boolean

Shows the audio player in a card layout if true for better page integration.

true

Best Practice: Use a ContentDocumentId for secure Salesforce files; test autoplay on different devices. Dynamic values (e.g., {!Record.FieldApiName}) are supported only on Lightning Record Pages.

Note: No Interactions or Style tabs are available in App Builder for this component, as styling and interactions are predefined or managed via properties.


Examples

Example 1: Audio Instructions on Training Record

Scenario: Embed instructional audio content on training record pages, allowing learners to access spoken instructions and guidance directly within Salesforce.

Prerequisites: This example assumes you have created a custom Training object (Training__c) and a custom field to store audio file references (Instructions_Audio_ID__c).

Steps

1

Edit your Training record page (Setup > Lightning App Builder > find your Training page)

2

Drag the AX - Audio component onto your page layout

3

Configure Audio Source

  • Set Audio Url or Content Document Id to {{Record.Instructions_Audio_ID__c}} (assumes custom field storing ContentDocumentId)

  • Alternative: Use a direct ContentDocumentId like 069XXXXXXXXXXXX for testing

4

Configure Playback Controls

  • Leave Auto Play unchecked (allows users to start audio when ready)

  • Leave Loop unchecked (single playthrough for instructional content)

  • Leave Hide Controls unchecked (gives users full control over playback)

5

Configure Display Options

Check Display as Card for professional presentation with styled container

6

Add Header Information

  • Set Header Title to Training Instructions

  • Set Header Caption to Audio guidance for this module

  • Set Header Icon Name to utility:volume_high

7

Save and test audio playback

Result: A professional audio player card on training record pages that allows learners to access spoken instructions with full playback control, enhancing the learning experience with multimedia content


Key Considerations

  • File Source: Use ContentDocumentId for secure files; ensure URLs are accessible.

  • Playback Settings: Avoid autoplay on public pages for accessibility; use Loop for repetitive content.

  • Page Layout: Enable Display as Card for a polished look on dashboards.

  • Performance: Keep audio files small to avoid page load issues.

  • Accessibility: Test audio with screen readers; provide transcripts if needed.


Troubleshooting Common Issues

  • Audio Not Playing: Verify the URL or ContentDocumentId is valid and accessible. Check file format (MP3, WAV, OGG).

  • Controls Missing: Ensure Hide Controls is false if controls are needed.

  • Dynamic Content Fails: Confirm {{Record.FieldApiName}} syntax matches the object’s field on Record Pages.

  • If Issues Persist: Contact our support team at [email protected]envelope for assistance.


Summary

The Avonni Audio component enriches Lightning pages with embedded audio for training, marketing, or customer use cases. It’s perfect for delivering sound content seamlessly.

Last updated

Was this helpful?