Yes. The best way to add a video is a shape with its Fill set to Video. It plays a YouTube or Vimeo video, or your own video file, and you can size and place it like a picture. For music or sound, use the Audio widget.
Where should your video live?
| YouTube or Vimeo | Your own video file | |
|---|---|---|
| Space on your hosting | None. The video stays on YouTube or Vimeo. | The whole file is published to your hosting |
| Bandwidth (the data your site sends to visitors) | Comes from YouTube or Vimeo | Every view uses your plan's bandwidth |
| Publishing | Nothing extra to send | Large files take longer to publish |
| Looks | Shows the YouTube or Vimeo player | No outside branding |
For most videos, put them on YouTube or Vimeo first. It saves space and bandwidth, and they play smoothly on slow connections.
Add a video
- Click Shapes in the toolbar and choose a rectangle.
- With the shape selected, go to Inspector > Shape Options (the second icon).
- Set Fill to Video.
- In the menu below, choose the source: YouTube Video, Vimeo Video, Local Video File (your own file) or External Video URL (a video file stored on another website).
- For YouTube or Vimeo, paste the video's link. Open the video in your browser and copy the address from the address bar, not the link from the Share button, which doesn't always play. For your own file, click Choose... and pick it, or drag the file onto the shape.
- Choose the options you want: Auto play, Mute, Loop, Show controls, and a Thumbnail (a picture that shows before the video plays).
- Resize the shape. On a Responsive page, tick Full width in Inspector > Metrics and set a Max Width, so it shrinks to fit a phone.
- Publish, and check the video on the live page.
You'll also see YouTube, Vimeo and Video widgets in the Widgets tab. They still work, but a Video Fill gives you more control, so we recommend it.
Using your own video file
- Use an MP4 file. Every modern browser plays it.
- Keep it small. Export it from your video app at a web or "streaming" size, rather than full quality. A short clip at a modest size loads much faster than a large original.
- Add a Thumbnail. Some phones don't show a preview of the video until someone taps it.
- Watch your space. Video files fill hosting space quickly, and each view uses bandwidth. If your hosting is filling up, move the videos to YouTube or Vimeo. See My hosting is full. What is using my space and how do I clear it? (Error 55).
A video in the background
- Behind the whole page: go to Inspector > Page Settings (the first icon), and under Browser Background, choose Video. You can set it to Loop, keep it in a Fixed Position, set a Scroll Speed, and add a Thumbnail.
- Behind one part of the page: add a shape with a Video Fill as above, tick Auto play, Mute and Loop, untick Show controls, and place your text on top. On a Responsive page, see Why won't this go where I drag it? for placing objects over each other.
Browsers only play a video by itself if it's muted. A video with sound waits until the visitor clicks play. Background videos may not play on every phone, so a Thumbnail makes sure something shows.
Music and sound
Drag the Audio widget from the Widgets tab onto your page, and choose an MP3 file in Inspector > Widget Settings. You can set the volume, and choose to loop, play when the page opens, or start muted. As with video, most browsers won't play sound until the visitor clicks, so add a play control rather than relying on autoplay.
If your video doesn't play
| What you see | What to do |
|---|---|
| Error 153, or "An error occurred", inside EverWeb or in Preview | This can happen only in EverWeb and Preview. Publish, then check the live page. |
| "Sorry, we're having a little trouble" or a blank player | Use the link from the browser's address bar, not the Share button |
| It won't start by itself | Tick Mute. Browsers block videos that start with sound. |
| It's slow or keeps buffering | Make the file smaller, or put it on YouTube or Vimeo |
| A blank box on an iPhone until tapped | Add a Thumbnail |