Videos your client uploaded (see How clients upload videos) can be used anywhere the editor takes a video. The video picker (Video Content) has a Client videos tab next to Upload, Library and Paste a link on any site that belongs to a client. Every video field opens it through Choose video (or Replace): the Video widget, Video Gallery items, Scroll Video, Expanding Media, background videos, custom widget video fields and CMS Video fields. It opens on Client videos when the client has some.
A video visitors can watch
- Add a Video widget, or select one and click Choose video (or Replace) in its Design panel.
- Open the Client videos tab and click a video.
It plays in a proper video player: quality that adapts to the visitor's connection, captions when the video has them, and controls in your site's main theme color. The player only loads when the video scrolls into view, so it doesn't slow the page down. All the Video widget's settings are in Video, audio and Lottie widgets.
A background video
- Select a section, column or inner column and open Design > Style > Video.
- Click Choose video, open Client videos and click a video. (Or use Upload, Library, or Paste a link for a YouTube, Vimeo or direct video link.)
- Set the options below.
Background videos start with Autoplay, Loop and Mute on. They load when they come into view and pause when scrolled away. They don't show the poster first: the section's own background shows until the first frame plays. Visitors who've asked their device for less motion, or whose browser blocks autoplay, see the poster instead. With Loop off, a background video stops on its last picture. Text on top follows the usual readability rules: check your words read over the moving picture, and consider a Pattern over video to calm it.
Background video settings
- Autoplay: starts playing on its own. Default on.
- Loop: starts again at the end. Default on.
- Mute: plays without sound. Default on. "Required for autoplay in most browsers": if you turn Mute off, most browsers won't start the video by themselves.
- Controls (sections only): shows play, pause and volume controls on the background video. Default off.
- Display on mobile: whether the video plays on phones. Off shows a still picture instead. On a section this can be set per screen size; on a column it's one switch, and YouTube or Vimeo videos have limited phone support.
- Display mode: Fill crops the video to cover the box. Full video shows the whole frame, with your background color filling the sides.
- Focal point (Fill, uploaded or direct videos only): aims the crop on desktop. Tablet and mobile fit full width automatically.
- Poster image: shown while the video loads and wherever the video is hidden. Click Add, then Change or Remove.
- Pattern over video: a dot, line or texture picture over the video, under the words. See Gradients, background layers and text effects.
- Remove (next to the video's name) takes the video off.
Everything else in the Style panel is in Section and column design.
Client videos also work in the Scroll Video, Expanding Media and Media Slider widgets.
Examples
- A roofer's hero: a drone clip from the client's videos as a section background, Fill, Mute on, a poster from the same clip, and Display on mobile off so phones load fast.
- A gym's class video with sound: a Video widget (not a background), so visitors press play and hear it.
- A restaurant ambience strip: a short kitchen clip in a column background, Full video, with a dark background color filling the sides.
Limits and what it can't do
- Upload takes MP4, WebM or OGV files up to 50 MB.
- A background video is the same on every screen size, apart from Display on mobile.
- Most browsers block autoplay with sound, so a background video with Mute off may not start until the visitor clicks.
- Focal point only works for uploaded or direct video files, not YouTube or Vimeo.
- Columns don't have the Controls switch.
- Backgrounds use a lighter copy of a client video, so pages stay fast. The Video widget uses the full-quality copy (up to 1080p).
Good to know
- A client video can be picked once it shows Ready and its web copy is made, usually a minute or two after upload. Until then it's grayed out.
- You can also upload a video from the Client videos tab. It goes into the client's media too.
- Deleting a video from the client's media stops it playing on every page that uses it.
- A private (unlisted) Vimeo video works too. Paste its full share link, including the last part (vimeo.com/123456789/abc123def4 or a link with ?h=…). That part is what lets the video play on your site.
Who can use it
Agency people with the Mount Olympus tool. Client people need the Editor permission to set a background video or change a Video widget's design.
Troubleshooting
- "No client videos yet": the client hasn't sent any videos. Upload one from the tab, or ask the client to use their upload link or portal.
- A video is grayed out: it isn't ready yet. Wait a minute or two.
- "File too large (max 50 MB).": shorten or compress the video, or upload it to YouTube or Vimeo and paste the link on the Paste a link tab.
- "Please select a video file (.mp4, .webm, .ogv).": the file isn't a video. Export it as MP4.
- "Enter a valid YouTube, Vimeo, DailyMotion or direct video link.": check the link. For an unlisted Vimeo video, include the part after the number.
- The background video doesn't play on phones: Display on mobile is off (the poster shows), or it's a YouTube or Vimeo video, which phones often won't autoplay. Use an uploaded file.
- The background video doesn't start on its own: Mute is off. Turn it on.
- Black bars at the sides: Display mode is Full video. Switch to Fill.