Webmaster's Blog

Video/360 Image Snippet

Published
By

This snippet creates an embedded video or 360 image in your page’s main content area, additional content area, or right sidebar. To include a video at the very top of the page (known as the mediazone or hero area), follow the instructions for MultiEdit Content.

The size of the video/image will automatically adjust based on the location you insert it. A title and description can be included beneath it.

Example of an embedded video with a Title and Description.

360 Image with yellow bar at the bottom for interactive controls and the description.

Video/360 Image Snippet with the fields labeled 1 through 6.

View embedded video/360 images in the Style Guide. Read more about video accessibility requirements.

  1. Enter the YouTube, Vimeo, or Flickr URL in the URL field.
    1. All videos are required to have closed captions that meet the current accessibility standards.
    2. For a YouTube video, the URL must be the youtube.com format, not youtu.be. If you enter a playlist URL rather than an individual video, the snippet will display the first video of the playlist.
    3. If it is a 360 image, enter the Flickr URL, which can be found by clicking the image download icon, right-click on the Large option, and select Copy Link Location.
    4. If the video is not online and you have the video file, upload the file into the CMS, type the name of the file in the URL field, and link to it. The file type should be .mp4. If there is any audio, on-screen text, or other content that requires closed captions, you must include those captions for accessibility compliance. In that case, you must upload the caption file and thumbnail image in steps 5 and 6.
  2. Enter a title to display beneath the video in the Title field, if desired. This can only be used for video, not 360 images.
  3. Enter a description in the Description field to appear beneath the video or image, if desired.
  4. The Yaw indicates the angle that the 360 image starts at. By default, this is set to 50°. Enter a new angle to display instead. For example, if you enter 90, the starting point of the image will move 40° counter-clockwise from the original point (90-50=40).
  5. If you used an uploaded mp4 file in step 1, you must also upload the caption file. Upload the file into the CMS, type the name of the file in the URL field, and link to it. The file type should be .vtt.
  6. If you used an uploaded mp4 file in step 1, you must also include an image to use on the video embed. Create a card image type using the Image Editor. Using the Insert/Edit Image icon Photo icon in the toolbar to insert or edit an image., insert the largest size card that was cropped.