Squarespace, one of the most popular no-code CMS platforms, makes it easy for just about anyone to build an eye-catching website. Embedding video on Squarespace is a breeze, and the Wistia player is easily customized to match any design.
Getting Started
Recommended embed settings for Squarespace:
Inline (Standard) embed
Responsive sizing
Advanced settings => Use oEmbed URL ✅
Add videos with the Squarespace embed block
The embed block in Squarespace is easy to use and offers a surprising amount of flexibility. Embed via URL or use HTML embed codes - the choice is yours, though embedding via URL is definitely the easiest option.
For the full details on the embed block, see the adding videos to your site article from Squarespace.
Inline embedding with URLs
For Inline embeds, open the embed menu in Wistia and select Advanced settings => Use oEmbed URL ✅.
In Squarespace, add an embed block to your page:
In the Squarespace editor, click Add Block => Embed block
Click the edit button on the block
Select Embed As: Link and paste in your Wistia oEmbed URL
You'll see a message that says Searching, followed by Successfully Located if the URL is valid, at which point you should see the embed block update with a preview of the video. Save and view your published page to see the goods!
If you see a "Script Disabled" message or a blurry thumbnail image, not to worry - this is only visible in the editor. Save and view your published page for the final results.
Popover embedding with URLs
To embed popovers using URLs, start by copying the Inline embed as explained above. Then simply change the embedType option in the URL to async_popover:
From the embed menu, select an Inline embed (any type)
Choose responsive sizing
Enable Use oEmbed URL under advanced settings
Click Copy Code
The URL will look something like this:
https://harper.wistia.com/medias/bl2upaub45?embedType=async&seo=false&videoFoam=true&videoWidth=960
In the URL you'll see an embedType option set to either async or iframe. Change this to say embedType=async_popover instead:
https://harper.wistia.com/medias/bl2upaub45?embedType=async_popover&seo=false&videoFoam=true&videoWidth=960
Now just paste your popover URL into the Squarespace embed block, Save, and check your published page!
Embedding with HTML embed codes
To use HTML embed codes, simply select your embed type and options from the Wistia embed menu, and disable Use oEmbed URL under Advanced Settings. This works for both Inline (any type) and Popover embeds.
In the Squarespace editor, click Add Block => Embed block
Click the edit button on the embed block
Select Embed As: Code Snippet and click Embed Data >
Paste in your Wistia embed code
You should see the embed block update with a preview of the video as soon as you paste in the code - Save and check your published page!
If you see a "Script Disabled" message or a blurry thumbnail image, not to worry - this is only visible in the editor. Save and view your published page for the final results.