> For the complete documentation index, see [llms.txt](https://docs.customiframe.com/llms.txt).
> Use it to discover all available pages before exploring further.

# Embed Vimeo Video in Gutenberg

Step-by-step guide to embed Vimeo video in Gutenberg using the Custom iFrame WordPress plugin. No API key needed. No coding required.


## Overview

Custom iFrame lets you embed Vimeo video in Gutenberg by pasting any Vimeo video URL into the block. No API key or Vimeo account required to display public videos.

Custom iFrame is a WordPress plugin by CoderzStudio that embeds 100+ external sources in Elementor and Gutenberg without writing any code.

Using Elementor instead? Follow the [Embed Vimeo Video in Elementor](/elementor/video/embed-vimeo) guide.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- WordPress with the Gutenberg block editor
- A Vimeo video URL to embed

## Step 1: Get the Vimeo Video URL

<Steps>
  <Step title="Open Vimeo" icon="play" title-type="p">
    Go to [vimeo.com](https://vimeo.com) and find the video you want to embed.
  </Step>
  <Step title="Copy the video link" icon="link" title-type="p">
    Click the **three-dot menu** on the video. Click **Copy link** to copy the video URL.
  </Step>
</Steps>

## Step 2: Install the Plugin and Add the Block

<Steps>
  <Step title="Install and activate the plugin" icon="download" title-type="p">
    Go to your WordPress dashboard. Go to **Plugins > Add New**. Search for **Custom iFrame by Coderz Studio**, click **Install Now**, then click **Activate**.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1777223431/getting-started/installation/Custom-iFrame-Installation.webp"
      alt="WordPress Add New Plugin screen showing Custom iFrame by Coderz Studio in search results with Install Now button"
      width="1024"
      height="396" priority={true} fetchPriority="high" />
  </Step>
  <Step title="Open your page in the block editor" icon="layout" title-type="p">
    Go to the page or post where you want the video. Click **Edit** to open the Gutenberg block editor.
  </Step>
  <Step title="Add the Custom iFrame block" icon="plus" title-type="p">
    Click the **Add Block** button. Search for **Custom iFrame**. Click the block to add it to the page.
  </Step>
</Steps>

## Step 3: Embed Vimeo Video in Gutenberg

<Steps>
  <Step title="Paste the Vimeo URL" icon="clipboard" title-type="p">
    Select the Custom iFrame block. In the right panel, paste the Vimeo URL into the **Source URL** field. The video player appears inside the block in the editor.
  </Step>
  <Step title="Set height and publish" icon="check" title-type="p">
    Set **Height** to 450px for a standard 16:9 Vimeo video, or enable **Auto Height**. Click **Update** or **Publish**.
  </Step>
</Steps>

## Step 4: Configure Advanced Options (Pro)

<Callout kind="info">
  The options below require Custom iFrame Pro (Starter, Studio, or Agency plan). [View pricing](https://customiframe.com/pricing) — plans start at $29 one-time.
</Callout>

**Autoplay:** Start the video automatically when the page loads.

**Mute:** Silence the video by default. Required alongside Autoplay on most browsers.

**Loop:** Repeat the video continuously.

**Color:** Set a custom hex color for the Vimeo player controls to match your site theme.

**Show Portrait / Title / Byline:** Control whether the author avatar, video title, and creator name appear on the player.

**Privacy Mode:** Prevent Vimeo from tracking viewers via cookies.

<Callout kind="success">
  Click **Update** or **Publish**. Your Vimeo video is now live on your WordPress site.
</Callout>

For all block settings, see the [Set Up Custom iFrame in Gutenberg](/getting-started/gutenberg-setup) guide.

This guide showed you how to embed Vimeo video in Gutenberg using the Custom iFrame plugin. From copying the video link to pasting the URL and publishing, the whole setup runs through the block editor without any code.

## Troubleshooting

**Video shows blank:** The video may be set to private on Vimeo. Only public and unlisted videos can be embedded.

**Video is cut off:** Increase the height value or enable Auto Height.

**Domain restriction error:** Some Vimeo Pro accounts restrict embedding to specific domains. Check your Vimeo privacy settings.

For more help, see [iFrame Not Showing](/troubleshooting/iframe-not-showing).

## FAQ

<ExpandableGroup>
  <Expandable title="Do I need a Vimeo account to embed a video?" default-open="false">
    No. You can embed any public Vimeo video by pasting its URL. You only need a Vimeo account if you want to upload or manage the video itself.
  </Expandable>
  <Expandable title="Why does my Vimeo video show blank?" default-open="false">
    The video is likely set to private or restricted to specific domains on Vimeo. Go to Vimeo privacy settings and confirm the video allows embedding.
  </Expandable>
  <Expandable title="Can I control autoplay and color for Vimeo?" default-open="false">
    Yes with Pro. Custom iFrame Pro includes Vimeo Advanced Controls for autoplay, loop, color, portrait, title, and byline settings. [View pricing](https://customiframe.com/pricing).
  </Expandable>
  <Expandable title="What height should I use for a Vimeo video?" default-open="false">
    450px works well for most 16:9 Vimeo videos. Enable Auto Height to let the block calculate the correct size based on the video dimensions.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

<Columns cols="2">
  <Card title="Embed Vimeo in Elementor" href="/elementor/video/embed-vimeo" icon="layers" horizontal={false}>
    Guide for the Elementor widget.
  </Card>
  <Card title="Embed YouTube Video in Gutenberg" href="/gutenberg/video/embed-youtube" icon="play" horizontal={false}>
    Embed YouTube with full Pro controls in Gutenberg.
  </Card>
</Columns>

## Related Guides

- [Embed Video in Gutenberg - Overview](/gutenberg/embed-videos)
- [Embed YouTube Video in Gutenberg](/gutenberg/video/embed-youtube)
- [Embed Wistia Video in Gutenberg](/gutenberg/video/embed-wistia)
- [Vimeo Advanced Controls (Pro)](/features/vimeo-advanced)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)