> 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 Audio in Elementor

Guides for embedding Spotify, SoundCloud, Boomplay, Spreaker, NRK Radio, and more in Elementor using the Custom iFrame WordPress plugin. No coding required.


## Overview

Custom iFrame lets you embed audio in Elementor from Spotify, SoundCloud, Boomplay, Spreaker, NRK Radio, and more. Paste any audio URL into the widget. No API keys, no shortcodes, no coding required.

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

Using Gutenberg instead? Follow the [Embed Audio in Gutenberg](/gutenberg/embed-audio) guide.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- Elementor installed
- An audio URL from any supported platform

## How to Embed Audio in Elementor

All audio platforms follow the same three-step process.

### Step 1: Get Your Audio Link

<Steps>
  <Step title="Open the audio platform" icon="music" title-type="p">
    Go to the platform where your audio is hosted: Spotify, SoundCloud, Boomplay, or any other supported source.
  </Step>
  <Step title="Copy the share link" icon="link" title-type="p">
    Find the share or copy-link option on the track, playlist, or station. Copy the URL to your clipboard.

    Each platform guide below shows exactly where to find the share link.
  </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 audio player. 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: Paste the URL and Publish

<Steps>
  <Step title="Paste the audio URL" icon="clipboard" title-type="p">
    In the Content tab, paste the URL into the **Source URL** field. The audio player appears in the editor.
  </Step>
  <Step title="Set height and publish" icon="check" title-type="p">
    Set **Height** to match the player size. 152px works for a single Spotify track. 380px works for a playlist. Click **Update** or **Publish**.
  </Step>
</Steps>

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

## Supported Audio Platforms

Select your audio platform for a step-by-step embed guide.

<Columns cols="2">
  <Card title="Embed Spotify in Elementor" href="/elementor/audio/embed-spotify" icon="music" horizontal={false}>
    Embed Spotify tracks, albums, and playlists in Elementor.
  </Card>
  <Card title="Embed Spotify Playlist in Elementor" href="/elementor/audio/embed-spotify-playlist" icon="list-music" horizontal={false}>
    Embed a full Spotify playlist with track listing and controls.
  </Card>
  <Card title="Embed SoundCloud in Elementor" href="/elementor/audio/embed-soundcloud" icon="headphones" horizontal={false}>
    Embed SoundCloud tracks and playlists in Elementor.
  </Card>
  <Card title="Embed Boomplay in Elementor" href="/elementor/audio/embed-boomplay" icon="radio" horizontal={false}>
    Embed Boomplay music tracks and albums in Elementor.
  </Card>
  <Card title="Embed Spreaker in Elementor" href="/elementor/audio/embed-spreaker" icon="mic" horizontal={false}>
    Embed Spreaker podcast episodes and shows in Elementor.
  </Card>
  <Card title="Embed NRK Radio in Elementor" href="/elementor/audio/embed-nrk-radio" icon="broadcast-tower" horizontal={false}>
    Embed NRK Radio podcasts and programs in Elementor.
  </Card>
</Columns>

## Also in Gutenberg

All audio platforms are also supported in the WordPress block editor.

See [Embed Audio in Gutenberg](/gutenberg/embed-audio) for all Gutenberg guides.

## Related Guides

- [Getting Started: Install Custom iFrame](/getting-started/installation)
- [Elementor Widget Setup](/getting-started/elementor-setup)
- [Auto Height Adjustment](/features/auto-height)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)