Followers:

Asked: Updated: Followers:

Note: While our most popular guides have been translated into Spanish, some guides are only available in English.

Video blocks

Last updated

Use video blocks to add externally hosted videos, including live streaming YouTube or Vimeo videos, to your site. This guide uses a YouTube video as an example.

Note: To add videos using a URL, use YouTube or Vimeo. 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:

  1. Edit a page or post, click an insert point, and click Video from the menu. For help, visit Adding content with blocks.
  2. Add a video by using a URL or embed code.
  3. Add a custom thumbnail image.
  4. Add a video caption.
  5. Click outside the block editor when you're done. Your changes save automatically.

Add a video

You can add videos using your video's URL or embed code. If you're not sure which method to use, visit Choosing the right video embed option.

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.

In the block editor, paste the URL into the Video URL field. 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 click Copy link address. Paste that URL into the Video URL field.

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 Embed data, then paste the embed code into the text field. Use the keyboard shortcut Ctrl + V (or ⌘ + V on a Mac) to paste, then click Back.

Use the URL

To use the URL:

  1. Find the video you want to use in a web browser.
  2. Copy the URL for your video from your browser's address bar or the Share area, depending on your video host.
  3. Return to the Squarespace app and tap Source in the block editor.
  4. In the URL tab, paste the URL in the text field.
  5. Tap Video to return to the block's settings

Use the HTML embed code

To use the embed code:

  1. Find the video you want to use in a web browser
  2. Most video services have a Share or Embed button located near the video. Click Share or Embed, then copy the embed code provided.
  3. Return to the Squarespace app and tap Source in the block editor.
  4. Tap Embed, then paste the embed code in the Embed code field.
  5. 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.
  • The custom thumbnail hides the title of the video.
  • 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:

  1. In the block editor, click Custom thumbnail and select On.
  2. Click Add image to upload a file from your computer, or click and drag your image into the image uploader.
  1. Tap Custom thumbnail in the block editor.
  2. Switch the Use custom thumbnail toggle on.
  3. Tap Add custom thumbnail to take a photo or upload an image from your device.
  4. Tap Video to return to the block's settings.

Add a video caption

To add a video caption:

  1. In the block editor, click Caption and select On.
  2. Click Write here... in the text field and type your description. Then, select Caption below to display this description below the video block.
  1. Tap Caption in the block editor.
  2. Switch the Show caption toggle on.
  3. Tap into the text field below Caption and type your description.
  4. 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.

Was this article helpful?
72 out of 267 found this helpful

Related articles

Navigation
    1. Squarespace Help
    2. Pages and Content
    3. Blocks
    Video blocks