PATTERN OVERVIEW

Feature a video that plays in-line (directly on the page) or in a pop-up modal from a hero banner, sub hero banner or color block play a video in a popup overlay modal. 

Note: The pattern and specifications for a Looping video clip banner component differ from the standard video specifications.

Guidelines

• Follow the video specifications to assure that the file is compatible with the video player component and the widest array of user devices and platforms. NOTE: If the requirements are not followed, the video cannot be played with the video player.
  
  
• Add the video player inside of the right or left column of a 2 column column control. Avoid adding the player inside of a 3 or 4 column layout.
  
  
• Make the video accessible by including a full-text transcript (text file) and closed caption file (.vtt) — see accessibly requirements.
  
  
• A title or some type of introduction should be a placed above or alongside the video player to provide context.
  
  
• Optional: Add a teaser image as the default start screen to entice video views. 
  

AEM component: Use the video component to add a player directly to the page. Use the main hero, sub-hero or colorblock component to set up a video that opens in a popup overlay modal.