Embed Spotify songs, playlists, sets, and artist pages in your markdown files!
- Install plugin to your site:
yarn add gatsby-remark-embed-spotify- Add
gatsby-remark-embed-spotifyto yourgatsby-transformer-remarkplugins ingatsby-config.js:
plugins: [
{
resolve: "gatsby-transformer-remark",
options: {
plugins: ["gatsby-remark-embed-spotify"]
}
}
];- Restart gastby.
## My blog post
This is an example of embedding a single spotify track.
Just type your markdown as you normally do, and then insert a valid
spotify link anywhere to automatically transform it into an embed!
https://open.spotify.com/track/6CnkGSMarTBjIKWuuGXBNl?si=ecMRoa36RnWte3RR7PdJhw
You can also embed albums
https://open.spotify.com/album/3ICWz0kXRrh74cfcS0diek?si=AEK51ar4RI6zNduAVMmI-Q
And playlists!
https://open.spotify.com/user/garetmckinley/playlist/2SmGA6PDALbMzfBwseeDNx?si=CDGId95KQHis8uYipbXLzQ
And artist pages!
https://open.spotify.com/artist/0nLTVC5FExtXgF3RoLh0TH?si=SIPTIBZHTaiODE_WNqB-BANOTE: Make sure to copy the link instead of embed code or Spotify URI.
plugins: [
{
resolve: "gatsby-transformer-remark",
options: {
plugins: [
{
resolve: "gatsby-remark-embed-spotify",
options: {
width: 800, // default is "100%"
height: 600 // default is 400
}
}
]
}
}
];MIT