For my TIL Christmas Song viz in Figure 1 (see it here!), I embedded a Spotify playlist so you can listen to the music in the viz as you explore. Embedding a Spotify playlist/ track/ album can be great for adding another dimension to your vizzes. For example, they can supplement a viz about podcasts, movie soundtracks, or other musical topics.
Fig 1. The Colours of TIL’s Christmas
Doing this though, was not as easy as I expected. I expected a simple ‘copy playlist link’ from Spotify and paste into the Web Page object on Tableau Desktop (Figure 2) and boom! Embedded playlist. Nope.
Method 1 below will show you what happens when you paste a URL in directly. In Method 2, I go over how to embed your playlist more neatly.
Fig 2. How simple I thought embedding a playlist would be
Method 1: Pasting URL in Web Page directly
To retrieve your link, go into Spotify (web player, desktop or mobile versions will work), locate your track/album/playlist, click on the three dots ‘…’ and click (in my case) ‘Copy Playlist Link’ (Figure 3). This will copy the link to your clipboard.
Fig 3. Retrieve your Spotify link
After inputting my playlist URL as in Figure 2, the result was as shown in Figure 4. The whole web page was inserted into the box instead of a small play button with album pictures as I wanted. According to other blog posts I found on this topic, Spotify provides an embed link as well as a regular link. However, it seems that this is no longer the case. Boo.
If this method suits your vizzing purposes then awesome! If not, read on to Method 2.
Fig 4. What happens when you insert the playlist URL directly
Method 2: Editing URL into embed-able format
When you copy a link from Spotify, it will look something like this:
https://open.spotify.com/playlist/0hQKgwFSOR0YYDHVtAUloO
What we want, is a format like this:
https://embed.spotify.com/?uri=spotify%3Aplaylist%3A0hQKgwFSOR0YYDHVtAUloO
To get your URL into an embed-able format, copy the last string (after the last /) in your URL and paste in the link below where it says ‘PASTE HERE‘. Change the word ‘playlist’ in the link below to ‘track’ or ‘album’ in the link below if necessary.
https://embed.spotify.com/?uri=spotify%3Aplaylist%3APASTEHERE
Now, paste your new embed URL into a Web Page object in Tableau Desktop. You will get a white box that you cannot interact with as shown in Figure 5. This is fine! When you upload to Tableau Public, your embedded playlist will look something like Figure 6. Perfect!
Fig 5. What will happen when you insert an embed link
Fig 6. Embedded playlist as seen in Tableau Public
Happy Viz-mas!
Louise
Check me out my blog feedmedata and follow me on @FeedMeData_