Digital Experience Studio > Website Technology > Sitecore CMS > Sitecore Component Guide >

Video Player

Video Player

The Video Player is available as a standalone component that can be placed on a page content area. It can also be placed in content containers, such as a Grid Container, or in other content components, such as in an Accordion tab. The Video Player includes optional title and caption fields and works with Sitecore-hosted video files and select video hosting platforms.

Screenshot of video component on page
Figure 1: Example of a Video Player component, preceded by text on the page.

Component Information

Benefits

  • Provides a means of sharing video content on a website without forcing the viewer to leave the page to watch the video.
  • Enables a content author to provide contextual descriptive text with the video.
  • Works with YouTube, Vimeo and Kaltura MediaSpace, so units can avoid having to upload video files in multiple locations and can benefit from the additional visibility of sharing videos on these other platforms. 

Example Use Cases

  • Embed social media videos into a webpage from YouTube, Vimeo or Kaltura MediaSpace.
  • Share videos within context of related content, such as tutorials or demonstration videos with written instructions. 

Live Example

Template Data

Many of the video component data fields can be found in Page Builder and Content Editor. Descriptions below cite Page Builder because it is the most comprehensive set of available fields.

Title (single-line text)

  • Enter a title to appear with the video.
  • Optional field.

Caption (single-line text)

  • Enter a description to appear with the video.
  • Optional field.

Media (file selection)

  • Browse to select a video file from media library.
  • Must select a file in this field or include a video ID in a YouTubeID, Vimeo ID or Kaltura Embed field.

Video Captions (file selection)

  • Browse to select a caption file from media library.
  • All videos should be properly captioned to meet accessibility standards.
  • Optional field. If using a video hosted in another platform, a file is not needed. Be sure captions were added in the platform (e.g., YouTube). 

Video Thumbnail Image (file selection)

  • The thumbnail is the image that displays in a component before the video is played.
  • Click Upload to add a video thumbnail file.
  • Click Browse media library to select an image file previously uploaded.
  • Optional field. If using a video hosted in another platform, a thumbnail file is not needed. Be sure to set the video thumbnail image in the platform (e.g., YouTube).

Image alt text (single-line text)

  • Add alt text to describe the thumbnail image.
  • Images should include alt text to meet accessibility standards.

YouTube ID

  • Include the YouTube video ID from the YouTube URL.
  • Optional field. If using a native video file uploaded to the media field, this ID field remains empty. 

Vimeo ID

  • Include the Vimeo video ID from the Vimeo URL.
  • Optional field. If using a native video file uploaded to the media field, this ID field remains empty. 

Kaltura Embed

  • Include the src attribute from the Kaltura embed iframe tag.
  • Optional field. If using a native video file uploaded to the media field, this ID field remains empty. 

Variant

  • Default
  • No Modal

Advanced Styling

Autoplay (checkbox)
  • Check this box to have the video automatically play upon page load.
Loop (checkbox)
  • Check this box to have the video play in a loop.
  • This is best used for atmospheric videos that do not involve dialog.
Title Padding
  • Six levels of left and right padding (from 0 to 5)
Caption Padding
  • Six levels of left and right padding (from 0 to 5)
Video Padding
  • Six levels of left and right padding (from 0 to 5)
Play Button Style
  • Dark
  • Light

Frequently Asked Questions

The Video Player component supports YouTube, Vimeo, Kaltura MediaSpace and Sitecore-hosted video files.

From a public video page, the video ID is the string of characters that appears after “watch?v=” in the video URL (available in the browser URL bar or from the Share link option on YouTube). If the video is in a list, do not include the character after the video ID starting with “&list=.” 

From the Video Details pane on an owned YouTube channel, the video ID is the string of characters at the end of the Video link, displayed under the preview panel on the right side of the Video details page.  

Instructions for Use

In Page Builder:

  1. Select the page in the Content Tree.
  2. Click the “+” button in any Placeholder box below the Breadcrumb links.
  3. Select the Video Player component from list.

Alternate method:

  1. Click Components tab at the top of the Content Tree.
  2. Locate the Video Player component.
  3. Drag the Video Player component to any empty placeholder area of the page or into the component that will contain the Video Player below the Breadcrumb links.

If this is new Video Player content:

  1. In the “Assign content item” dialog box, hover over “Data” until a “+” appears to the right.
  2. Click “+” and select Video Player.
  3. Give the component a unique name and click off the name area.
  4. Click Assign.

If using existing Video Player Data (content):

  1. Select the proper Video Player data source from the list.
  2. Click Assign.

In Page Builder:

  1. Click the Video Player component and display the component details on the right side panel. Click the Design tab.
  2. Click Advanced Styling to expand the section.
  3. Adjust settings, as needed:
    1. Check Autoplay to enable the video to automatically play on page load.
    2. Check Loop to enable the video to loop.
    3. Choose a Title Padding setting to change from the default of 0.
    4. Choose a Caption Padding setting to change from thedefault of 0.
    5. Choose a Video Padding setting, if desired.
    6. Choose a Play Button Style, if desired. Keep color contrast with the video thumbnail in mind.  

In Page Builder:

  1. Click the Video Player component and display the component details on the right side panel. Click the Content tab.
  2. Add a Title and Caption, if desired.
  3. Add a video using one of the following methods:
    1. Click Browse media library to upload a video file to Sitecore. Follow the steps. Repeat to upload a Video Caption file and Video Thumbnail Image, using the media library links for these respective fields.
    2. Add a YouTube video ID to the YouTube ID field. The system will automatically pull in the video thumbnail from YouTube.
    3. Add a Vimeo video ID to the Vimeo ID field. The system will automatically pull in the video thumbnail from Vimeo.
    4. Add the "src" attribute from the Kaltura embed iframe code in the Kaltura Embed field. The system will automatically pull in the video thumbnail from Kaltura.
  4. Make additional adjustments in Page Builder, including advanced styling, if necessary.
  5. Preview the page.
  6. Click Actions and Submit to send the page to the publishing workflow.

Tool Use Guide

*Upload audio captioning and video thumbnails for platform-hosted videos directly in the platform (e.g., YouTube).

 

Documentation updated: June 15, 2026

Is there an issue with this documentation? Report it here.