AX - Video

Overview

AX - Video is an Experience Cloud component that embeds video players on Experience Sites pages and supports, supporting YouTube, Vimeo, Salesforce Content Documents, and direct video file URLs.

Use it to display training content, product demos, tutorials, or support videos directly in your portal. Pull video sources from field values to display different videos per record, and configure playback options such as autoplay, looping, and player controls in Experience Builder.

Perfect for video libraries, training centers, product demonstrations, onboarding content, or anywhere portal users need video content without redirecting to external sites.

---

Getting Started

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

---

Properties

Name	Description	Usage
CMS Video OR Video URL	Define the video's source, either by selecting a video from a CMS or providing a direct YouTube URL	Choose the video source that best aligns with your content strategy, ensuring that it is effectively integrated and managed within your pages.
Volume	Set a background image for the container.	Upload or provide a URL for an image that enhances the visual appeal of the container, contributing to the mood or thematic tone you wish to convey.
Playback Rate	Apply a color overlay on top of the background image.	Choose a color that subtly overlays the background image, helping to maintain the visibility and readability of the content within the container.
Autoplay	Decide whether the video should automatically start playing when the page is loaded.	Enable or disable autoplay based on user experience considerations, ensuring that the video playback aligns with user expectations and browsing behavior.
Loop	Determine whether the video should loop continuously once it reaches the end.	Use the loop feature to keep the video playing repetitively, suitable for background visuals or consistent multimedia presence on a page.
Hide Controls	Choose whether to display or hide the video controls, affecting how users interact with the video content.	Customize control visibility based on the desired level of user interaction and the aesthetic considerations of your page layout.
Size	Define the size parameters of the video, including width and height, and control the overflow behavior.	Adjust the video size and overflow settings to ensure the video integrates seamlessly into the page, maintaining a responsive and visually cohesive layout.

---

Use Case Examples

Example 1: Product Video

Bring Your Products to Life with Embedded Video

Embed product demo videos directly on your product pages, giving customers instant access to the information they need, right where they need it. The result is a richer self-service experience that builds product confidence and reduces inbound support requests.

---

What You'll Achieve

• Deeper product understanding: Give customers and partners instant access to product demos, walkthroughs, and tutorials without ever leaving the page.

• Stronger self-service adoption: Reduce inbound support requests by letting users find answers visually, at their own pace.

---

Prerequisites

Make sure the following are in place:

• Product object pages: Set up and active on your Experience Cloud site.

• ProductDemoURL__c : A custom field on the Product object to store each product's video URL.

---

How to Set It Up

1

Add the component

• Open Experience Builder and navigate to your product article page. Drag the AX - Video component onto the page in your desired location.

2

Connect your data

• Select a data source and map the video URL field to pull the link dynamically from each product record.

• Video URL : {!Item.ProductDemoURL__c}

3

Adjust the appearance

• Set the component width to 500px, or adjust to fit your page layout.

4

Preview & publish

• Use the built-in preview to confirm the video renders correctly across your product pages, then publish when ready.