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

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


## Overview

Custom iFrame lets you embed Spotify audio in Elementor by pasting any Spotify share link into the widget. Display music tracks, episodes, 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 Gutenberg WordPress instead? Follow the [Embed Spotify Audio in Gutenberg WordPress](/gutenberg/audio/embed-spotify) guide.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- Elementor installed
- A Spotify track, episode, or podcast URL to embed

## Video Tutorial

<iframe
  src="https://www.youtube.com/embed/zfHvNiNaZTU"
  width="720"
  height="405"
  frameBorder="0"
  allowFullScreen
/>

## Step 1: Get the Spotify URL

<Steps>
  <Step title="Open Spotify and find your audio" icon="music" title-type="p">
    Go to [open.spotify.com](https://open.spotify.com) and find the track, episode, or podcast you want to embed.
  </Step>
  <Step title="Copy the share link" icon="link" title-type="p">
    Click the three-dot menu next to the audio. Hover over **Share**. Click **Copy Song Link** for a track or **Copy Episode Link** for a podcast episode.
  </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: Embed Spotify Audio in Elementor

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

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776886026/elementor/audio/spotify/paste-spotify-url.webp"
      alt="Custom iFrame widget in Elementor editor showing Spotify URL in Source URL field with live Spotify audio player preview"
      width="1024"
      height="464" priority={true} fetchPriority="high" />
  </Step>
  <Step title="Set height and publish" icon="check" title-type="p">
    Set **Height** to 152px for a single track or 380px for a playlist. Click **Update** or **Publish**.
  </Step>
</Steps>

## Troubleshooting

**Player shows blank:** Confirm the Spotify content is public. Private tracks cannot be embedded.

**Player is cut off:** Single tracks need at least 152px. Playlists and albums need at least 380px.

**Podcast episodes do not load:** Copy the link from the three-dot menu. Avoid copying from the browser address bar.

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

## FAQ

<ExpandableGroup>
  <Expandable title="Do I need a Spotify account to embed audio?" default-open="false">
    No. Spotify's embedded player works for public content without a listener account. You do not need an API key.
  </Expandable>
  <Expandable title="Can I embed a Spotify playlist?" default-open="false">
    Yes. Copy the playlist share link and paste it into the Source URL field. Set height to at least 380px to show the full playlist player. See the [Embed Spotify Playlist in Elementor](/elementor/audio/embed-spotify-playlist) guide.
  </Expandable>
  <Expandable title="Can I embed a Spotify podcast episode?" default-open="false">
    Yes. Open the episode on Spotify. Click the three-dot menu, hover over Share, and click **Copy Episode Link**. Paste that URL into the Source URL field.
  </Expandable>
  <Expandable title="What height should I set for Spotify?" default-open="false">
    Use 152px for a single track. Use 380px or more for playlists, albums, and podcasts. Enable Auto Height to let the iFrame resize automatically.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

<Columns cols="2">
  <Card title="Embed Spotify Audio in Gutenberg WordPress" href="/gutenberg/audio/embed-spotify" icon="layout" horizontal={false}>
    Guide for the WordPress block editor.
  </Card>
  <Card title="Embed Spotify Playlist in Elementor" href="/elementor/audio/embed-spotify-playlist" icon="music" horizontal={false}>
    Embed full Spotify playlists in Elementor.
  </Card>
</Columns>

## Related Guides

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