Video widget

Overview

Use this widget to display a single video on your page. The widget uses Telerik RadMedia Player, which is an HTML5 video player. It supports WebM (.webm), Ogv (.ogv), and MP4 (.mp4) file formats. You can choose a video from the already uploaded or upload a new video.

Configure the widget

After you have dragged the Video widget on your page you must configure it to display a video. 

  1. To do this, click Edit button in the upper-right corner of the widget.
    The Video window appears.
  2. Choose between the following:
    • Select video
      The system displays recent video.

      NOTE: You can also search for a video by its name. If you are searching for a video that has language versions, you can enable the option to get search results that include the video, even though it may be in a language different than the one currently selected. For more information, see Administration: Enable multilingual search results in media libraries.

      1. In the right side of the window, select the library where the video you want to display is located.
        The system displays all videos and libraries in this library.
        You can display all uploaded videos by clicking All videos.
        For more information, see Videos.
      2. Click the video you want to display.
      3. Click Done.
    • Upload video
      1. To upload a video, drag and drop it in the window or click Select video from your computer, browse your computer to find the video you want to upload and click Open.
        You can select and display only one video.
      2. In Library, select the library where you want to put the video, by clicking Change.
        The tree with all created libraries appears. Select the library and click Done.

        NOTE: If you want to store the video in a new library, you must create it. To do this, click Create new library.

      3. You can change the Title of the video.
      4. Change the categories and the tags which the video is assigned to, by clicking Categories and tags.
        For more information, see Add categories and tags to content items.
      5. If you have added any custom fields for videos, all created fields, appear after the Categories and tags section.
        For more information about creating custom fields and hiding default fields, see Overview: Custom fields

        NOTE: Some of the above fields may not be displayed when you upload a video, if the view has been modified. To modify the view, click Administration » Settings » Advanced » ContentView » VideosBackend » Views » SingleVideoUploadDetailsView » Sections.

      6. Click Upload.

        NOTE: If you are using multiple site management and the Libraries module uses data sources from more than one site, you must first choose the source from which you want to display videos or where a video, uploaded from your computer, will be saved.

        To do this, use the dropdown button in the upper-right corner of the window.
        For more information, see Multisite: Manage multiple sites.
  3. To change the selected video, click Change video button and perform Step 2.
  4. To edit the video, click Edit all properties.
    The Edit video window opens. Perform procedure Edit videos.
  5. Click Settings tab.
  6. In the dropdown box, select the Aspect ratio of the video.
  7. When you are finished, click Save.
    The Video window closes and the Video widget is configured to display the video you have selected. 

    NOTE: If your site is multilingual and the page you are editing is synchronized with another translation, when you edit the widget, the Save to all translations button appears. If you click it, the current widget configuration will be saved to all translations, else, if you click Save, the widget configuration is saves only to the current translation, but the pages are still synchronized. If your pages are synchronized, you can have different widget configurations, but you cannot have different widgets.

Media player settings

You can configure the settings of the Telerik RadMedia Player to specify how the media player behaves when placed in a Video widget on a page. For example, you can choose to automatically play the video once the page is loaded or change the appearance of the media player.

To change the default settings of the Telerik RadMedia Player:

  1. Open the widget for editing and in the lower-right corner, click Advanced button.
  2. Modify one or more of the following media player settings:
    • AutoPlay
      To automatically play the video when the page is loaded, set the value to true
    • FullScreen
      To open the video in full screen when the page is loaded, set the value to true

      NOTE: To automatically open and play the video in full screen once the page is loaded, set both AutoPlay and FullScreen properties to true

    • Height
      Change the default height value to specify the height of the media player
    • Width
      Change the default width value to specify the width of the media player
    • StartTime
      Change the time (in seconds) at which the player starts playing the video. For example, enter 10 to start playing the video from the 10th second onward.
    • StartVolume
      Change the volume (in percent) at which the media player initially plays the video. Enter a number between 1 and 100 percent. 
  3. Save your changes.

You can apply the settings above to the widget template of the HTML5 media player in general. For more information, see Create and edit widget templates.

Play YouTube videos and playlists

You can configure the Video widget to play a YouTube video or a YouTube playlist.

To do this, perform the following:

  1. Open the widget for editing and in the lower-right corner, click Advanced button.
    • If you want to play a single YouTube video, in YouTubeVideoURL, enter the URL of the video.
    • If you want to play a YouTube playlist, in YouTubePlaylistID, enter the YouTube playlist ID.
  2. Save your changes.

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Was this article helpful?

Next article

Video gallery widget