Embed a video on your website

Copy a short piece of code from Zidi and paste it into your website. The video then plays on your page.

Available on: Free, Starter and Pro

Get the embed code

In the sidebar, click My Library and open the video.
Click Share, then open the Embed tab.
Choose a size:
- Responsive size (default) fills the width of the space it is in and keeps a 16:9 shape. Use this in most cases.
- Fixed size uses the width and height you enter, in pixels. The default is 640 × 360, and the minimum is 100.
Click Copy embed code. You see "Embed code copied!".

The responsive code looks like this:

<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;"><iframe src="https://app.zidi.ai/preview/<video-id>" style="position:absolute;top:0;left:0;width:100%;height:100%;border:0;" allowfullscreen allow="autoplay; encrypted-media; web-share" title="<video title>"></iframe></div>

Anyone who opens the share page can also click Get Embed Code there. That button gives the responsive version only.

The embed guides on the Integrations page say to click Get Embed Code on the video page. On your own video page, use Share and the Embed tab instead.

What the embed shows

The embed shows the full share page, not only the player. Viewers see the video, its title and description, the like button, the Discussion area, your call-to-action button if you set one, and a small Zidi header with Sign Up for Free.

Plays in the embed count as views in Video analytics.
Viewers in an embed are anonymous. To know who watched, send a tracked link instead.
Password-protected videos and the tracking consent banner may not work inside an embed on another website. For those, share the link instead of the embed code.

Requirements

Your page must use HTTPS. The embed does not load on pages that start with http://.
Use the embed code from Zidi. Only the share link (/preview/) can be embedded. Campaign links (/c/) and other Zidi pages refuse to load inside another site.
Allow the Zidi app in your site's security settings. If your site uses a Content Security Policy, add frame-src https://app.zidi.ai. The in-app guides say https://zidi.ai, but that address alone still blocks the embed.

Paste the code in your website builder

Each builder has its own block for custom code. Paste the embed code there, then preview and publish. The builders' menus can change; if a name below does not match, look for their HTML, Code or Embed block.

WordPress

In the block editor, click + and add a Custom HTML block. In the Classic editor, switch to the Text tab.
Paste the embed code.
Preview the page, then publish.

Webflow

In the Webflow Designer, open the Add panel and drag an Embed element onto the page.
Paste the embed code and click Save & Close.
Publish the site.

Wix

In the Wix Editor, click Add, then Embed Code and Embed HTML.
Choose Code, paste the embed code and click Update.
Resize the element to fit your layout, then publish.

Squarespace

In the page editor, add a Code block. Make sure Display Source is off.
Paste the embed code.
Save and publish.

Carrd

Click + and add an Embed element. Set its type to Code.
Paste the embed code into the code field.
Resize and place the element, then save and publish.

Notion

Notion takes a link, not code. Copy the share link with the link icon (Copy link) on the video page. In Notion, type /embed, paste the link and confirm. You can also paste the link straight into the page and pick an embed option if Notion offers one.

Zidi has no special Notion player. Notion decides whether the link shows as a playable embed or as a link card. Either way, readers can open the video from it.

Substack

Copy the share link with the link icon (Copy link) on the video page and paste it into your post. Substack decides how the link appears. Zidi has no special Substack player, so readers may see a link card that opens the video on the share page. Preview the post before you publish.

Linktree

Linktree does not support embed code. Add the video as a link instead.

On the video page, click the link icon (Copy link). The link starts with https://app.zidi.ai/preview/.
In Linktree, add a new link and paste it.
Give the link a title and save.

Use the normal share link. Do not use a tracked link or a campaign link: those belong to one recipient, so every visitor would be counted as that person.

Troubleshooting

Problem	What to do
The embed is a blank or grey box	Check that your page uses HTTPS and that the code points to `/preview/`. If your site has a Content Security Policy, allow `https://app.zidi.ai`.
The embed shows "Video unavailable"	The video was deleted. Copy the code again from a video that still exists.
Viewers keep seeing the password screen	Password-protected videos may not work inside an embed on another website. Share the link instead, or remove the password.
The embed is too tall or too short	Use Responsive size, or copy Fixed size code with a different width and height.