Squarespace Integration

Embed Zidi videos on your Squarespace website using a Code block.

How to Embed

1. Open your video in Zidi and click Share.
2. Copy the embed code (iframe snippet).
3. In Squarespace, edit the page where you want the video.
4. Click Add Block (+) and select Code.
5. Paste the embed code into the code block.
6. Make sure Display Source is turned off.
7. Click outside the block to save, then Publish.

Embed Code

<iframe
  src="https://app.zidi.ai/v/your-video-slug"
  width="100%"
  height="400"
  frameborder="0"
  allowfullscreen
  style="border: none; border-radius: 8px;"
></iframe>

Responsive Embed

For a responsive video that maintains its aspect ratio:

<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
  <iframe
    src="https://app.zidi.ai/v/your-video-slug"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; border-radius: 8px;"
    allowfullscreen
  ></iframe>
</div>

Squarespace Versions

• Squarespace 7.1 — Use the Code block in any section.
• Squarespace 7.0 — Use the Code block or Markdown block.

Code blocks are available on all Squarespace plans (Business and above for JavaScript injection).

Tips

• Use the responsive wrapper for mobile-friendly layouts.
• Password-protected videos show a password prompt inside the embed.
• Add tracking pixels for analytics on embedded views.
• CTAs and engagement tracking work inside embedded videos.