Allow Videos to Auto-Play in Microapps

Note: This is a premium feature or service. This article only applies to your community if your Firstup contract includes this premium functionality. Please contact your Customer Success Manager with any questions about feature availability for your community.

Content published using a video template can be used by microapps to play the video within the microapp. Some web browsers, including Chrome, restrict the autoplay of videos to improve the user experience. In order to allow videos to auto-play in microapps, browser settings will need to be adjusted to disable autoplay blocking.

To modify the behavior of videos in a microapp:

1. Sign in to Creator Studio as a Brand Super Admin or an applicable custom role.
2. Navigate to Configure on the menu in the left and then select the Microapps tile.
3. Select an existing microapp, or create a new one.
4. Select the Content tab, where the following Video Options are available:
   • Autoplay - Automatically play videos. If a browser blocks video autoplay, the user will need to click play on the first video.
   • Mute - Play videos without sound. Some browsers will allow muted videos to autoplay.
   • Captions - Display captions (if available) when playing videos.
   • Hide Video Controls - Hide the video control bar while a video is playing.
   • Hide Play Button - Do not display a play button over videos.
5. If the Microapp will be viewed full-screen (e.g. as digital signage) select the Setup tab and enable Hide mouse cursor when idle.
6. Once satisfied with the video settings, click the Save button to save your feed.

It is recommended that videos are tested in the intended endpoint to account for differences in browser behaviour.

The following solution can be implemented to autoplay videos used for digital signage. This solution leverages Google Chrome flags being set for the URL by creating a shortcut.

1. Right-click the desktop background to pull up the context menu.

2. Create the shortcut to launch Chrome in Kiosk mode.

   • Browse to the Google Chrome.exe file.

     Example path to Google Chrome:
     "C:\Program Files\Google\Chrome\Application\chrome.exe"

   • Add a space after the path to Chrome and within double quotations(“) insert the Direct Link to the microapp

     Example: "C:\Program Files\Google\Chrome\Application\chrome.exe"" "https://app.onfirstup.com/embed/<alphanumeric string>"

   • Append the following flags after the .exe and target URL. These flags launch the browser in kiosk mode and will allow the videos to play without needing to interact with them
     

     --autoplay-policy=no-user-gesture-required --kiosk

   • The final product should be similar to the following:

     "C:\Program Files\Google\Chrome\Application\chrome.exe"" "https://app.onfirstup.com/embed/<alphanumeric string>" --autoplay-policy=no-user-gesture-required --kiosk

3. Click Next to advance to the next section.

4. Name the shortcut. Click Finish.

NOTE: All instances of Chrome should be closed before attempting to launch the newly created Chrome shortcut to ensure Kiosk mode launches properly.