Squarespace, one of the most popular no-code CMS platforms, makes it easy to build an eye-catching website. Embedding videos on Squarespace is a breeze, and the Wistia player is easily customized to match any design.
Recommended embed settings for Squarespace:
Inline (Standard) embed
Responsive sizing
Use oEmbed URL
Add video with the Squarespace embed block
The embed block in Squarespace is easy to use and offers significant flexibility. Embed via URL or use HTML embed codes—the choice is yours, though embedding via URL is definitely the easiest option.
Refer to Squarespace's documentation for an in-depth overview of the embed block.
Inline video embed
For inline video embeds, open the "Embed" menu in Wistia and check the "Use oEmbed URL" in "Advanced Settings".
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
If the Wistia media URL is valid, you'll see a message stating "Successfully located" and a thumbnail 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, don't worry—this is only visible in the editor. Save and view your published page for the final results.
Popover video embed
To embed popovers using URLs, start by copying the Inline embed as explained above. Then 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 paste your popover URL into the Squarespace embed block and check your published page!
Embed with HTML embed code
To use HTML embed codes, select your embed type and options from the Wistia embed menu, and disable the "Use oEmbed URL" option 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 video preview as soon as you paste the code. Save and check your published page!
If you see a "Script Disabled" message or a blurry thumbnail image, don't worry—this is only visible in the editor. Save and view your published page for the final results.