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 contact us on our developer community forum.

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 Spotify Embed generator.

You need to paste it into your web page somewhere between the tags <body> and </body>.

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 Spotify Embed 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.

Social Media

Although not supporting the customizable Spotify Embed experience, some social media websites support rich content when you post a Spotify link on your timeline/profile. You can get a link or share directly from the Spotify Desktop Client or Spotify Web Player. The following social media websites are supported: Facebook, Messenger, Twitter Telegram, Skype and Tumblr.

Here’s an example on how you can get a link or share directly from the player:

Sharing

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 the Follow Button or Spotify Embed 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 the code from the Follow Button or Spotify Embed generator and paste 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 Social Media 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 code from the Follow Button or Spotify Embed 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. In Share, 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 Spotify Embed 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.