Embed Spotify widgets into web pages on some of the most common websites and blogs:

Note: Many of these websites change their publishing flows on a regular basis. If you find that the instructions here are incorrect, please leave email us at developer-support@spotify.com.

Standard HTML Pages

In the HTML code of a page, hosted on a website that supports iframes, simply embed the code from Follow Button or the Play Button generator.

You need to paste it into your web page somewhere between the tags <body> and </body>. We have a tutorial which will take you through the steps. (If you cannot see those tags, you are probably not looking at the page in an HTML editor. Some blogging and social media systems provide you with an “HTML” view that you can switch to to paste the link.)

If you are trying to publish the widget in a common platform like Facebook or Tumblr, or on a blog, read on…

Blogger

  1. Go to your Blogger blog.
  2. Click New Post.
  3. Click the HTML button to switch to the HTML editing view.
  4. Copy-and-paste the code from the Follow Button or Play Button generator into the HTML/embed code frame.
  5. Click Publish.

Cloudflare Apps

  1. Visit the Spotify preview on Cloudflare Apps.
  2. Login or register to Spotify via the account picker.
  3. Configure the widget to your liking using the install options.
  4. Once the preview looks good, press “Install”. You’ll be taken to your Cloudflare dashboard to complete the installation.

Facebook

Although Facebook does not explicitly support the Spotify widgets, it does provide several ways of sharing Spotify content with your friends. You can just enter a Spotify link into your Facebook status box:

  1. In a Spotify player, next to an artist track, album, or playlist name, click the More (…) icon.
  2. Select Copy Spotify URL (or Copy Artist Link, Copy Track Link, and so on).
  3. In your Facebook page, in your status box, enter the link; Facebook then renders its own Spotify widget through which you can play music.
  4. Click Post.

Find sharing links also in the Spotify players that enable you to post a playlist to your connected Facebook account:

Sharing on Facebook

SquareSpace

In your SquareSpace website create a new page or edit an existing one.

  1. In the page editor, click an Insert point.
  2. Chose the Code block type.
  3. Copy-and-paste the code from Follow Button or the Play Button generator into the HTML/embed code frame.

  4. Position and resize the widget as desired.

Tumblr

In your Tumblr Dashboard create a new text post or edit an existing one.

  1. From the Settings menu, either select Text editor: HTML or in the toolbar, click the html link.
  2. Copy-and-paste the code from Follow Button or the Play Button generator into the main window.
  3. Click Post; the widget should now be visible in your blog.

Note:

  • Sometimes the Play Button takes a few seconds to appear. If nothing seems to happen, re-open your post in the Edit view and save it again without modifying it.
  • You can also drop Spotify Open links into Tumblr. Find sharing links in the Spotify players that enable you to post a playlist on your connected Tumblr account. See image in the Facebook section.

Twitter

Although Twitter does not explicitly support Spotify widgets it does provide several ways of sharing Spotify content with your friends. Simply enter a Spotify link into your tweet:

  1. In a Spotify player, next to an artist, track, album or playlist name, click the More (…) icon.
  2. Select Copy Spotify URL or Copy Artist Link, Copy Track Link, and so on.
  3. In your Twitter page click the Tweet button.
  4. In the Compose New Tweet box, enter the link; Twitter shortens the link automatically.
  5. Click Tweet.

There are also sharing links in the Spotify players that enable you to post a playlist to your connected Twitter account. See image in the Facebook section.

Wix

To add a Spotify Play button or Follow to a Wix website:

  1. In your Wix website.
  2. Click the Edit button.
  3. Click the Add (+) icon.
  4. Select Apps.
  5. Select HTML.
  6. Double-click on the grey placeholder. The HTML Settings window opens.
  7. From the Mode dropdown, select HTML code.
  8. Paste the embed code from the Follow Button or Play Button generator into the HTML/embed code frame.
  9. Check the Reset code box.
  10. Click Update.
  11. Position and resize the widget as desired.

Wix also has direct support for the Play Button as a Media element. See their instructions in the Wix Help Center.

WordPress

WordPress contains its own built-in player that you can use to play Spotify tracks, albums, and playlists.

  1. In a Spotify player, next to the name of an artist, track, album or playlist name, click the More (…) icon.
  2. Select Copy Spotify URL or Copy Artist Link, Copy Track Link, and so on.
  3. In your WordPress Dashboard, in the relevant page, enter the link.
  4. Click Preview; WordPress then renders its own widget through which you can play music.

Note: If you have installed a WordPress plugin that enables iframe support, you can also copy the code from the Follow Button or Play Button generator into a WordPress page.

Responsive Layouts

The widgets change their layout depending on the iframe size. To control the size of the widget, use CSS. For more information, check out this resource. You can also use embed responsively > Generic iFrame, and paste the code for the iframe. For a working example, see jsfiddle.