> 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 SoundCloud in Gutenberg

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


## Overview

Custom iFrame lets you embed SoundCloud in Gutenberg by pasting any SoundCloud audio link into the block. Display tracks, mixes, or podcasts 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 SoundCloud in Elementor](/elementor/audio/embed-soundcloud) guide.

## Requirements

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

## Step 1: Get the SoundCloud Audio Link

<Steps>
  <Step title="Open SoundCloud and find your audio" icon="music" title-type="p">
    Go to [soundcloud.com](https://soundcloud.com) and open the track you want to embed.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776912412/elementor/audio/soundcloud/get-soundcloud-link.webp"
      alt="SoundCloud track page showing the Copy Link button below the audio waveform"
      width="1024"
      height="493" priority={true} fetchPriority="high" />
  </Step>
  <Step title="Copy the track link" icon="link" title-type="p">
    Click the **Copy Link** button below the audio waveform. The URL is now in your clipboard.
  </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 SoundCloud in Gutenberg

<Steps>
  <Step title="Paste the SoundCloud URL" icon="clipboard" title-type="p">
    Select the Custom iFrame block. In the right panel, paste the SoundCloud 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">
    Set **Height** to at least 166px for a single track. Use 450px or more for playlists.
  </Step>
</Steps>

<Callout kind="success">
  Click **Update** or **Publish**. Your SoundCloud audio 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 SoundCloud in Gutenberg using the Custom iFrame plugin. From copying the share link to pasting the URL and publishing, the whole setup runs through the block editor without any code.

## FAQ

<ExpandableGroup>
  <Expandable title="Do I need a SoundCloud account to embed audio?" default-open="false">
    No. SoundCloud's embedded player works for public tracks without an account. You do not need an API key.
  </Expandable>
  <Expandable title="Can I embed a SoundCloud playlist or set?" default-open="false">
    Yes. Copy the playlist or set URL from the browser address bar and paste it into the Source URL field. Set height to 450px or more to show the full list.
  </Expandable>
  <Expandable title="The SoundCloud player shows blank. What should I check?" default-open="false">
    Confirm the track is public on SoundCloud. Tracks with embedding disabled or set to private cannot be displayed.
  </Expandable>
  <Expandable title="What height should I set for SoundCloud?" default-open="false">
    Use 166px for a single track. Use 450px or more for playlists. Enable Auto Height to let the player resize automatically.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

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

## Related Guides

- [Embed Audio in Gutenberg - Overview](/gutenberg/embed-audio)
- [Embed Spotify Audio in Gutenberg](/gutenberg/audio/embed-spotify)
- [Embed Spotify Playlist in Gutenberg](/gutenberg/audio/embed-spotify-playlist)
- [Auto Height Adjustment](/features/auto-height)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)