> 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 Spreaker Audio in Gutenberg WordPress

Step-by-step guide to embed Spreaker audio in Gutenberg WordPress using the Custom iFrame WordPress plugin. Display podcasts and shows. No coding required.


## Overview

Custom iFrame lets you embed Spreaker audio in Gutenberg WordPress by pasting any Spreaker embed URL into the block. Display podcasts, interviews, and shows on your WordPress page without an API key.

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 Spreaker Audio in Elementor](/elementor/audio/embed-spreaker) guide.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- WordPress with the Gutenberg block editor
- A Spreaker episode or show embed URL

## Step 1: Get the Spreaker Embed URL

<Steps>
  <Step title="Open Spreaker and find your audio" icon="music" title-type="p">
    Go to [spreaker.com](https://www.spreaker.com) and open the episode or show you want to embed.
  </Step>
  <Step title="Copy the embed URL" icon="link" title-type="p">
    Click the **Share** icon or the three-dot menu. Click **Embed**. Copy the `src` URL from the iframe code shown.
  </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 audio player. 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 Spreaker Audio in Gutenberg WordPress

<Steps>
  <Step title="Paste the Spreaker embed URL" icon="clipboard" title-type="p">
    Select the Custom iFrame block. In the right panel, paste the Spreaker embed URL into the **Source URL** field. The audio player appears inside the block in the editor.
  </Step>
  <Step title="Set the height" icon="move-vertical" title-type="p">
    Adjust the **Height** to fit your layout. Use 200px for a compact player or 400px for shows with episode lists.
  </Step>
</Steps>

## Step 4: Customize and Configure Settings

For styling, smart loading, and advanced options, see the [Style Custom iFrame](/getting-started/styling) guide. Adjust dimensions, backgrounds, borders, and more.

## Step 5: Save and Publish

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

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

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

## FAQ

<ExpandableGroup>
  <Expandable title="Do I need a Spreaker account to embed audio?" default-open="false">
    No. You do not need an account or API key to embed public Spreaker episodes. The embed URL is publicly available on each episode page.
  </Expandable>
  <Expandable title="Where do I find the Spreaker embed URL?" default-open="false">
    Click the Share or three-dot menu on any Spreaker episode. Select **Embed** and copy the `src` value from the iframe code. Paste that URL into the Source URL field.
  </Expandable>
  <Expandable title="The Spreaker player shows blank. What should I check?" default-open="false">
    Confirm you copied the `src` URL from the embed code, not the full iframe HTML. The Source URL field expects a URL only.
  </Expandable>
  <Expandable title="What height should I use for Spreaker?" default-open="false">
    Use 200px for a compact player. Use 400px or more for shows with episode lists. Enable Auto Height to let the player resize automatically.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

<Columns cols="2">
  <Card title="Embed Spreaker Audio in Elementor" href="/elementor/audio/embed-spreaker" icon="layers" horizontal={false}>
    Guide for the Elementor widget.
  </Card>
  <Card title="Embed SoundCloud in Gutenberg WordPress" href="/gutenberg/audio/embed-soundcloud" icon="music" horizontal={false}>
    Embed SoundCloud tracks in Gutenberg WordPress.
  </Card>
</Columns>

## Related Guides

- [Embed Audio in Gutenberg WordPress - Overview](/gutenberg/embed-audio)
- [Embed SoundCloud in Gutenberg WordPress](/gutenberg/audio/embed-soundcloud)
- [Embed Boomplay Music in Gutenberg WordPress](/gutenberg/audio/embed-boomplay)
- [Auto Height Adjustment](/features/auto-height)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)