How to Use the WordPress Spotify Embed Block

The WordPress Spotify embed block lets you add all sorts of musical goodies to your WordPress posts and pages. You can embed albums, playlists, podcasts or tracks, and anyone will be able to listen to them when visiting your site. They’ll hear a 30-second preview before being prompted to take the next step, like logging in or signing up. Also, you don’t actually need a paid Spotify account to embed music or podcasts, which means you can cater to your audience without adding another subscription to your monthly budget.

There are a number of reasons to want to embed Spotify links in your WordPress post or page:

  • Promote a creative project of your own (or someone else’s)
  • Connect your audience with content you know they’ll love
  • Provide samples of music or a podcast you’re critiquing or reviewing
  • Enhance your page with multimedia for your visitors’ listening pleasure

In this article, we’re going to walk you through how to add a Spotify embed block to a WordPress post or page and how to add all sorts of Spotify links to it. We’ll also cover tips, best practices and FAQs.

How to Add the Spotify Embed Block to a WordPress Page or Post

Before you can add Spotify links to WordPress, you have to know how to get the Spotify embed block up and ready for them. First, log in to your WordPress dashboard. Create or open a page or post. You’ll need to be using the Gutenberg editor for this.

By hovering over a blank area on your page, you’ll see a Plus Sign. Clicking that will bring up all of the blocks you can add to your WordPress post or page. Type “Spotify” in the search box, then choose the Spotify block that comes up. This will add the Spotify embed block to your WordPress post or page.

Twitter embed

spotify embed

wordpress blocks

Now let’s add some music or podcasts!

How to Embed Spotify Music in Your WordPress Post or Page

Let’s start with embedding a single track because embedding an album or playlist is going to follow a similar process.

How to Embed a Spotify Track to Your Post or Page

Open the Spotify web player and log in. Find the track you want to embed. Click the Three-Dot icon to the far-right. Hover over Share to bring up a second menu. Select Copy Song Link.

spotify embed

Go back to WordPress, paste that link into the Spotify embed box and click Embed.

wordpress blocks

This is what an embedded track will look like:

spotify embed

How to Embed a Spotify Album or Playlist to Your Post or Page

To embed an entire album in WordPress, go to the album on Spotify. (Make sure you’re actually on the album and not the artist’s page – it’ll be clear if you’re in the wrong place when you go to copy the link.) Hit the Three-Dot icon, hover over Share and choose Copy Album Link.

spotify embed

Paste the link into the Spotify embed box in WordPress and click Embed. All of the album tracks will show up, and users can scroll to see more.

wordpress blocks

To embed a Spotify playlist (yours or someone else’s), navigate to the playlist, click the Three-Dot icon, select Share and then choose Copy Link to Playlist.

spotify embed

This will show up the same as an album, with a list of tracks and a scroll bar on the right to see more.

wordpress blocks

How to Embed a Spotify Podcast to Your WordPress Post or Page

Embedding a podcast follows a similar process. First, you have to go to the main podcast page, not just the page for an individual episode. If you’re on an episode, clicking See All Episodes will take you to the main show page.

spotify embed

From there, click the Three-Dot icon to the right of the Follow link. Hover over Share, then click Copy Show Link from the menu that pops up.

wordpress blocks

Go back to the WordPress Spotify embed block, paste the link and hit Embed.

spotify embed

How to Embed a Spotify Podcast Episode to Your Post or Page

To embed a single podcast episode, you’ll follow a similar process. Go to the episode, click the Three-Dot icon to the right of the Plus Sign, hover over Share and select Copy Episode Link.

spotify embed

Go to WordPress, paste the link into the Spotify embed box and hit Embed.

wordpress blocks

The Spotify Embed Block Error Message

If you somehow grabbed a link that can’t be embedded, or you accidentally pasted only a portion of the link, you’ll get an error message. You have the option to try the link again or choose the Convert to Link option, but if neither one works, you’ll have to use a different link.

Spotify Embed Block Settings and Options

When you click on the Spotify embed block, four options show up in a toolbar above the top.

spotify embed

From left to right, these are:

  • Change block type or style: This lets you transform the block to a column or group layout. This option is finicky, but if you want to play around with it, you may be able to add more Spotify blocks (or other blocks) and arrange them in an interesting way, and you can also adjust color settings. Don’t bother with the Paragraph option, though – it’ll turn your URL into just text.
  • Change alignment: Align the embed box left, center or right, or choose wide or full width. Choosing Left or Center will make the box smaller, while choosing Wide or Full will make it as wide as the page.
  • Edit URL: Change the Spotify link you have in the embed box.
  • More options: Copy or duplicate the embed box, add another block before or after it, move it around the page, edit the block’s HTML, add it to your reusable blocks, turn the layout into a group or remove the block completely.
  • If you have any other blocks on the page, you’ll also see the Six-Dot Drag icon, which lets you click and drag the box somewhere else on the page, and the Up and Down Arrows icon, which lets you move the block up or down one spot per click.

    Tips and Best Practices for Using the Spotify Embed Block Effectively

    Use the Caption Field

    Under the embed box is space to add a caption. Use this so that visitors know exactly what they’ll play when they click on the media. So many Spotify embeds look the same that it can be hard to tell the difference between a music track and a podcast track, an album or a playlist, etc.

    Limit How Much Spotify Content You Add to a Single Page or Post

    Every time a visitor clicks Play on a Spotify track, it will stay on until the track ends or they manually stop it. If they hit Play on another track on the page, that will start playing too, right along with the one that’s already playing. This can be annoying to people who can’t find the others tracks that are playing that they want to stop. When possible, it’s most user-friendly to limit Spotify embeds to one per WordPress post or page to avoid confusion and a cacophony.

    Create a Playlist for More of a Selection

    Now, we know that there are going to be times when you want to add more than one track to a Spotify embed block. This is when it comes in handy to have playlists. And since you can add both music tracks and podcast episodes to a playlist, you can have all the media you want to share in one user-friendly box.

    Frequently Asked Questions About the Spotify Embed Block

    How do I make the Spotify embed box smaller?

    While the size of the Spotify embed block is automatically determined and can’t be adjusted much, you can play with columns, groups or alignment to see if that makes it smaller in your theme.

    How do I change the embedded music on Spotify?

    Head into your WordPress post or page to edit it, then go to the Spotify embed box you want to update. Click it to make the menu appear above it. Click the Pencil icon to edit the URL. Paste the URL you want to embed over the one that’s already in there, and click Embed to update it. Then make sure to publish the changes live so they show up on the front-end of your website.

    Do embedded Spotify tracks auto-play?

    No, embedded Spotify tracks only start to play when they’re manually played by the visitor.

    Wrapping Up

    Whether you’re a Spotify user right now or not, it’s good to know that the service seems to have just about anything you could think to search for, music-wise. And when it comes to podcasts, it supports a host of them, as well. The main drawback to the Spotify embed block for WordPress is that only a 30-second clip plays before directing users to their Spotify account. However, if all you want to offer is a preview, like if you’re trying to get people to listen to your full album on Spotify or subscribe to your podcast, then that’s the perfect way to do it. And either way, adding media that’s oh-so-pleasing to the ear is a wonderful way to give your website an appealing (and modern) boost.

    Have a podcast that you’re trying to get out there? We have a guide on how to submit your podcast for distribution everywhere.

    Featured Image via Hellas Fellas / shutterstock.com

    The post How to Use the WordPress Spotify Embed Block appeared first on Elegant Themes Blog.

    Go to source

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.