Use Video Blocks to add externally hosted videos to your site. This guide uses a YouTube video as an example.
Note: Squarespace doesn’t support uploaded video. When embedding a video using a URL, only YouTube, Vimeo, Animoto, and Wistia are supported. You can use embed code for other video hosting services. To learn more, visit Adding videos to your site.
Watch a video
Add a Video Block
To add a Video Block:
- Edit a page or post, click an insert point, and select Video from the menu. For help, visit Adding blocks.
- Add a video by using a URL or embed code.
- Add a custom thumbnail image.
- Add a video description.
- Click Apply to save your changes.
- Tap the Pages icon.
- Tap the title of the page you want to edit.
- Tap Edit or the pencil icon in the top-right corner.
- Tap the + icon in the top-right corner to open the block menu.
- Tap Video to add a Video Block.
- Tap Source to add a video using a URL or embed code.
- Tap Custom Thumbnail to add a custom thumbnail image.
- Tap Caption to add a video description.
- Tap Done or ✓ to save your changes.
Add a video
There are two ways to add a video:
Use the URL
Find the URL of your video from a supported host. Copy the URL from your browser's address bar or the Share area, depending on your video host.
Tip: To embed an Animoto video using its URL, use the branded https://animoto.com URL.
In the block editor, paste the URL into the Video URL box. Use the keyboard shortcut Ctrl + V (or ⌘ + V on a Mac) to paste.
Tip: To add a YouTube playlist, right-click the Play all button on YouTube and select Copy link address. Paste that URL into the Video URL box.
Use the HTML embed code
Most video services have a Share or Embed button located near the video. Click Share or Embed, then copy the embed code provided.
In the block editor, click the </> icon to add the embed code.
Paste the embed code in the Code window. Use the keyboard shortcut Ctrl + V (or ⌘ + V on a Mac) to paste. Click Set.
Use the URL
To use the URL:
- Find the video you want to use in a web browser.
- Copy the URL for your video from your browser's address bar or the Share area, depending on your video host.
- Return to the Squarespace App and tap Source in the block editor.
- In the URL tab, paste the URL in the text box.
- Tap Video to return to the block's settings
Use the HTML embed code
To use the embed code:
- Find the video you want to use in a web browser
- Most video services have a Share or Embed button located near the video. Click Share or Embed, then copy the embed code provided.
- Return to the Squarespace App and tap Source in the block editor.
- Tap Embed, then paste the embed code in the Embed Code box.
- Tap Video to return to the block's settings.
Note: If neither the URL nor the embed code work, the video host you're using probably doesn't use the oEmbed standard. For such services, we recommend placing the embed code in a Code Block.
Tip: For most video services, you can edit the embed code to enable autoplay. Learn more about autoplay here.
Add a custom thumbnail
After you've added the video, you can add a thumbnail image to overlay the video. Keep in mind:
- The image displays over the video on your site before video is played.
- On computers, the image overlay becomes a play button. For most services, clicking the image plays the video. For YouTube, clicking the image once shows the video player, then clicking again plays the video.
- On mobile devices, tap the image once to show the video player. The video's default thumbnail image will appear. Tap the play button to play the video.
To add a thumbnail:
- In the block editor, drag your image into the image uploader. You can also click Add a Custom Thumbnail to open a file selection menu and select a file from your computer.
- Check Use Custom Thumbnail.
- Tap Custom Thumbnail in the block editor.
- Switch the Use Custom Thumbnail toggle on.
- Tap Add Custom Thumbnail to take a photo or upload an image from your device.
- Tap Video to return to the block's settings.
Add a video description
To add a video description:
Click Write here... in the text box and type your description. Then, select Caption Below to display this description below the Video Block.
- Tap Caption in the block editor.
- Switch the Show Caption toggle on.
- Tap into the text box below Caption and type your description.
- Tap Video to return to the block's settings.
Some video services automatically populate this field when you add a video via URL. You can edit this text at any time.
Troubleshooting
To troubleshoot issues with Video Blocks, visit Adding videos to your Squarespace site.