How to Get a Spotify Embed Code and Paste It Anywhere

A Spotify embed code is a small piece of HTML (an <iframe>) that drops a live, playable Spotify player onto your own page. Visitors press play and hear the track, album, or playlist without leaving your site. It is the difference between linking out to Spotify and keeping people on your page while they listen.

This guide covers how to grab the embed code for anything on Spotify, how to paste it into a website, WordPress, Squarespace, and Notion, how to change the player size, and how to fix the classic “it only plays a 30 second preview” problem.

How to Get the Spotify Embed Code

You get the embed code from the Share menu. The cleanest place to do this is the desktop app or open.spotify.com in a browser, because the mobile app’s share options are more limited.

1. Open the track, album, playlist, artist, or podcast episode you want to embed.
2. Click the three dots (the “...” menu). On a playlist you can also right-click the playlist itself.
3. Hover over Share.
4. Choose Embed track (or Embed playlist, Embed album, and so on).
5. A dialog opens showing a preview of the player and the embed code. Adjust the size and background here if you want.
6. Click Copy to copy the <iframe> code to your clipboard.

The code you copy looks roughly like this:

<iframe src="https://open.spotify.com/embed/playlist/YOUR_ID"
  width="100%" height="352" frameborder="0"
  allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"
  loading="lazy"></iframe>

That allow="... encrypted-media ..." part matters. Leave it in. If you or a page builder strips it out, the player falls back to short previews instead of full tracks. Spotify calls this out in its own embed troubleshooting docs.

We are building a free Spotify embed generator here at SC Utility Hub so you can paste a Spotify link, pick a size, preview the player, and copy clean embed code in one step. If you also post SoundCloud tracks, our SoundCloud embed code generator does the same job for SoundCloud.

Customizing the Player Size

The embed dialog and the raw iframe both let you control how the player looks.

• Standard player. Taller layout that shows cover art and, for playlists and albums, a scrollable tracklist. This is the default and usually lands around 352px to 380px tall. Good when the music is the main event on the page.
• Compact player. A single slim row, roughly 80px to 152px tall. Good for a sidebar, a footer, or slipping a track into the middle of a blog post without eating the whole screen.
• Width. Setting width="100%" makes the player stretch to fill its container, which keeps it responsive on phones. A fixed pixel width works too if you want it a specific size.
• Background. The embed menu offers a dark or themed background option on some content types.

Exact pixel heights shift between Spotify updates, so treat the numbers above as a starting point and confirm what the dialog gives you. The safe move is to keep the height Spotify suggests and only change the width to 100%. If you set the height too short, the tracklist gets cut off.

Where to Paste a Spotify Embed

Once you have copied the code, where it goes depends on your platform. The one constant: you need a spot that accepts raw HTML, not a plain text field.

A plain HTML website

Paste the full <iframe> snippet into your page’s HTML wherever you want the player to appear. That is it. Make sure the page is served over HTTPS, because the embed loads over HTTPS and mixed-content pages can block it.

WordPress

In the block editor, add a Custom HTML block and paste the iframe into it, then preview. Do not paste it into a normal paragraph block in the visual editor, because WordPress escapes the code and you see the raw text instead of a player. There is a shortcut too: paste the plain open.spotify.com link on its own line and WordPress often auto-embeds it for you using its built-in Spotify support. If your host or a security plugin strips iframes, the Custom HTML block plus the auto-embed link are your two options.

Squarespace

Use a Code block and paste the iframe, or use an Embed block and paste the Spotify share URL. The Code block gives you more control over sizing.

Notion (how to embed Spotify in Notion)

Notion is the one people ask about most, and it does not use the iframe at all.

1. Copy the normal Spotify share link (the open.spotify.com URL), not the embed code.
2. In Notion, paste the link where you want the player.
3. Notion shows a menu. Choose Create embed.
4. The Spotify player appears inline. Drag its edges to resize it.

If pasting does not trigger the menu, type /embed, press enter, and paste the Spotify link into the embed box. Notion handles the rest. This matches the flow most Notion guides describe, and it is the reason the embed code itself is not needed there. The Spotify Community thread on Notion embedding is full of people landing on this exact “paste the link, not the iframe” answer.

Blogs and newsletters

Most hosted blog platforms accept either the iframe (in an HTML or code block) or the plain share link (auto-embed). Email newsletters are the exception: most email clients strip iframes for security, so a Spotify player will not play inside an email. Use a linked cover image that opens Spotify instead.

When the Spotify Embed Player Is Not Working

A working embed that suddenly misbehaves almost always comes down to one of these.

It only plays a 30 second preview

This is the top complaint, and it has two common causes:

• You are not logged in. The embed plays full tracks only when the visitor is signed in to Spotify in that same browser. A logged-out visitor, or someone in a private window, hears the 30 second preview. That is expected behavior, not a bug. Threads like the Spotify Community post on embeds only showing previews come back to this again and again.
• The encrypted-media permission got stripped. If your page builder cleaned up the iframe and removed allow="... encrypted-media ...", Spotify limits playback to previews. Check the pasted code still has that attribute. Spotify’s troubleshooting guide names this directly and says to watch the browser console for a “Spotify was not able to play encrypted media” warning.

The player is blank or does not load

• Wrong block type. Pasting the iframe into a visual or text field instead of an HTML or code block. Move it to a Custom HTML, Code, or Embed block.
• Mixed content. Your page is on HTTP, or something on it is, and the browser blocks the HTTPS embed. Serve the whole page over HTTPS.
• Ad blockers and privacy extensions. These sometimes block the Spotify iframe. Test in a clean browser or incognito with extensions off before assuming your code is wrong.
• Unsupported browser. Spotify embeds are built for Chrome, Firefox, Edge, Opera, and Safari. Older or fringe browsers can fail.

It works on desktop but not mobile

Usually a sizing issue. Set width="100%" so the player scales to the screen, and give it enough height that the controls are not cut off.

If you would rather people scan their way to your music in the real world instead of streaming it on a page, that is a different tool. Our Spotify Codes guide covers making a scannable code for flyers and merch, and the scanning walkthrough shows listeners how to open it. For the rest of the set, see all our Spotify tools and guides.

FAQ

Sources

• Spotify Embeds troubleshooting (Spotify for Developers)
• Spotify Embeds documentation (Spotify for Developers)
• Embed only showing preview (Spotify Community)
• How to play music in Notion (Spotify Community)
• How can I embed a Spotify playlist into a blog post (Shopify Community)
• How to Use, Create, and Share Spotify Codes (Spotify Newsroom)