NOTE: This documentation covers the old version of our embed. The documentation for our new embed, which loads faster, scrolls smoother and has a dark theme, can be found here.
What is the Songlink Embed?
The Songlink Embed allows you to inject the Songlink experience into your blog or website. By aggregating songs and albums across all the major streaming services, the Songlink Embed will ensure that all of your readers and users will be able to engage and listen to the music you are discussing.
The easiest way to get the code necessary to add an embed to your website is to head to home page and find the Songlink you'd like to embed. Then, on the Songlink page, click the SHARE button underneath the album art, then click the Embed icon.
A popup should load which will have each of the three different sizes and layouts of embeds we support. Find the one you'd like to use, copy the embed code and paste it into the HTML of your website.
If you're having issues implementing the code into your website, feel free to reach out to us at firstname.lastname@example.org and we'll be happy to help you get set up.
The following documentation describes how to compose embed codes for any song or album. If you'd like to programmatically or automatically create embeds from songs or albums on Spotify, Apple Music, etc, then keep reading.
The Songlink Embed code is easy to implement via an
<iframe/> and is similar to other embed experiences from YouTube and Spotify.
Implementing the Songlink Embed
To implement a Songlink Embed to your blog or website, add an
<iframe/> like this one:
<iframe width="480" height="199" src="https://song.link/embed?url=spotify:track:1eQBEelI2NCy7AUTerX0KS" frameborder="0" allowtransparency allowfullscreen></iframe>
To choose which song or album you want, simply modify the
?url= parameter of the
?url= parameter should be the URL of the song or album you want to embed. We support song and album URLs from Spotify, Apple Music, YouTube, SoundCloud, Google Play Music, Tidal and Deezer. You can also pass in any valid Songlink URL, such as https://song.link/s/4sPmO7WMQUAf45kwMOtONw.
encodeURIComponent(url) before adding it as the
Our embed experience will look good in almost all sizes, but we suggest a minimum width of 280px and a minimum height of 88px.
Different Songlink Embed Layouts
There are three types of Songlink Embeds: compact, album, and video.
The Compact Embed contains only the listen, buy and share icons. This layout is probably best used in support of your current YouTube, Spotify or other embed solution. Many bloggers have added the Compact Embed directly underneath their YouTube embeds.
To render a Compact Embed, set the
height of the
<iframe/> to be
128px or less, but no smaller than
88px. Here is example code for a Compact Embed:
<iframe width="560" height="99" src="https://song.link/embed?url=spotify:track:1eQBEelI2NCy7AUTerX0KS" frameborder="0" allowtransparency allowfullscreen></iframe>
Since the Compact Embed has no identifying information about the song or album, we recommend you use it beneath and in support of other embeddable experiences from YouTube, Spotify, etc.
The Cover Art Embed is slightly taller and it displays the title, artist and album cover. It’s also the default layout if there isn’t a YouTube video for the song you’re sharing.
To render a Cover Art Embed, set the
height of the
<iframe/> to be between
199px. Here is example code for a Cover Art Embed:
<iframe width="560" height="199" src="https://song.link/embed?url=spotify:track:1eQBEelI2NCy7AUTerX0KS" frameborder="0" allowtransparency allowfullscreen></iframe>
The Video Embed has it all: a prominent, featured music video supported by links to the song or album on all the major streaming platforms.
To render a Video Embed, set the
height of the
<iframe/> to be
200px or larger. Here is example code for a Video Songlink Embed:
<iframe width="560" height="414" src="https://song.link/embed?url=spotify:track:1eQBEelI2NCy7AUTerX0KS" frameborder="0" allowtransparency allowfullscreen></iframe>
For a Video Songlink Embed, we recommend the
width * 0.5625 + 88, but the Video Songlink Embed will look pretty good in many aspect ratios, including the 9:16 ratio that is used by YouTube embeds.
Converting YouTube embeds into Songlink Embed
If you already have a YouTube embed, you can simply prepend
https://song.link/embed?url= to the YouTube
src URL of the
<iframe/>. For example, if you have a YouTube
<iframe/> with the following
You can simply add a little bit of Songlink magic:
Et voilà, you’ve created a Songlink Embed.
Embedding Songlinks on Medium
If you write stories using the Medium platform, embedding a Songlink into your next story is as easy as pasting a Songlink URL into the text. Medium will automatically recognize it and convert the link into the embedded experience.
If you have any questions or want some help with integrating the Songlink Embed into your website or blog, ping us on Intercom with the chat bubble in the bottom right corner of the screen.