> 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 TED Video in Elementor

Step-by-step guide to embed TED video in Elementor using the Custom iFrame WordPress plugin. Share inspiring talks on your WordPress page. No coding required.


## Overview

Custom iFrame lets you embed TED video in Elementor by pasting the TED embed URL into the widget. Share inspiring talks, expert insights, and ideas directly on your WordPress page.

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

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- Elementor installed
- A TED talk URL to embed

## Step 1: Get the TED Embed URL

<Steps>
  <Step title="Open TED and find your talk" icon="play" title-type="p">
    Go to [ted.com](https://www.ted.com) and find the talk you want to embed.
  </Step>
  <Step title="Copy the embed URL" icon="link" title-type="p">
    Click the **Share** button below the video. Select **Embed**. Copy the iframe code shown in the panel.

    From the copied iframe code, extract only the `src` URL. It follows the format `https://embed.ted.com/talks/TALK_SLUG`. Paste that URL into Custom iFrame.
  </Step>
</Steps>

## Step 2: Add the Custom iFrame Widget

<Steps>
  <Step title="Open your page in Elementor" icon="layout" title-type="p">
    Go to the page where you want the TED talk. Click **Edit with Elementor**.
  </Step>
  <Step title="Drag the widget onto your page" icon="move" title-type="p">
    Search for **Custom iFrame** in the Elementor widget panel. Drag the widget into your layout.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776867149/getting-started/elementor-setup/Guide-Add-Custom-iFrame.webp"
      alt="Custom iFrame widget being dragged from the Elementor panel into a page section in the editor"
      width="1024"
      height="337" priority={true} fetchPriority="high" />
  </Step>
</Steps>

## Step 3: Embed TED Video in Elementor

<Steps>
  <Step title="Paste the TED embed URL" icon="clipboard" title-type="p">
    In the Content tab, paste the TED embed URL into the **Source URL** field. The talk player appears in the editor.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776885901/elementor/video/ted/embed-ted.webp"
      alt="Custom iFrame widget in Elementor editor showing TED embed URL in Source URL field with TED talk preview"
      width="1024"
      height="486" priority={true} fetchPriority="high" />
  </Step>
  <Step title="Set height and publish" icon="check" title-type="p">
    Set **Height** to 450px or enable **Auto Height**. Click **Update** or **Publish**.
  </Step>
</Steps>

## Troubleshooting

**Talk does not load:** Confirm you are using the embed URL from Share > Embed, not the regular watch page URL.

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

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

## FAQ

<ExpandableGroup>
  <Expandable title="Where do I find the TED embed URL?" default-open="false">
    Open the talk on TED.com. Click **Share**, then select **Embed**. Copy the iframe code. Extract the `src` value from the code. It looks like `https://embed.ted.com/talks/TALK_SLUG`. Paste that URL into the Source URL field.
  </Expandable>
  <Expandable title="Do I need a TED account to embed talks?" default-open="false">
    No. TED talks are publicly available. You can access the Share > Embed option without an account.
  </Expandable>
  <Expandable title="Do I need Custom iFrame Pro to embed TED?" default-open="false">
    No. Basic TED embedding works with the free version. Pro adds lazy loading, placeholder images, auto-refresh, and advanced styling.
  </Expandable>
  <Expandable title="What height should I use for a TED talk?" default-open="false">
    450px works well for standard 16:9 TED talks. Enable Auto Height to let the iFrame resize automatically with the content.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

<Columns cols="2">
  <Card title="Embed YouTube Video in Elementor" href="/elementor/video/embed-youtube" icon="layers" horizontal={false}>
    Embed YouTube with full Pro controls.
  </Card>
  <Card title="Embed Vimeo Video in Elementor" href="/elementor/video/embed-vimeo" icon="layers" horizontal={false}>
    Full Vimeo embed guide with Pro options.
  </Card>
</Columns>

## Related Guides

- [Embed Video in Elementor - Overview](/elementor/embed-videos)
- [Embed YouTube Video in Elementor](/elementor/video/embed-youtube)
- [Embed Vimeo Video in Elementor](/elementor/video/embed-vimeo)
- [Auto Height Adjustment](/features/auto-height)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)
