Below, you’ll find a detailed guide on how to add the Sp*tify Play Button for WordPress Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Sp*tify Play Button for WordPress Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the Sp*tify Play Button for WordPress Plugin and the shortcodes it provides:
"Sp*tify Play Button for WordPress is a handy plugin that seamlessly integrates your favorite Spotify tracks into your WordPress site. Easy to install and use, this plugin enhances your site's audio experience."
- [spotifyplaybutton]
Sp*tify Play Button for WordPress [spotifyplaybutton] Shortcode
The Spotify Play Button shortcode is designed to embed a Spotify play button in WordPress posts or pages. The shortcode allows customization of the button size, type, and linked Spotify content. It generates an iframe with the Spotify content and an optional “Open in Spotify” link. The shortcode is flexible, allowing for the input URL or Spotify URI.
Shortcode: [spotifyplaybutton]
Parameters
Here is a list of all possible spotifyplaybutton shortcode parameters and attributes:
play
– Spotify URI or URL of the playlist or songsize
– Width of the Spotify player in pixelssizetype
– Determines the height of the player, ‘big’ or ‘compact’link
– Controls if an “Open in Spotify” link is included
Examples and Usage
Basic example – Embed a Spotify playlist on your WordPress site using the default settings.
[spotifyplaybutton play="spotify:user:jonk:playlist:2ImDreMyt1Py2iXKtmEStW" /]
Advanced examples
Customize the size of the Spotify playlist embed to fit your page design.
[spotifyplaybutton play="spotify:user:jonk:playlist:2ImDreMyt1Py2iXKtmEStW" size="300" /]
Change the size type of the Spotify playlist embed to ‘compact’ for a smaller, more minimalistic look.
[spotifyplaybutton play="spotify:user:jonk:playlist:2ImDreMyt1Py2iXKtmEStW" sizetype="compact" /]
Disable the ‘Open in Spotify’ link if you want to keep users on your site.
[spotifyplaybutton play="spotify:user:jonk:playlist:2ImDreMyt1Py2iXKtmEStW" link="no" /]
Combine different parameters to fully customize your Spotify playlist embed.
[spotifyplaybutton play="spotify:user:jonk:playlist:2ImDreMyt1Py2iXKtmEStW" size="300" sizetype="compact" link="no" /]
PHP Function Code
In case you have difficulties debugging what causing issues with [spotifyplaybutton]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode( 'spotifyplaybutton', 'spotifyplaybutton_func' );
Shortcode PHP function:
function spotifyplaybutton_func( $atts ) {
extract( shortcode_atts( array(
'play' => 'spotify:user:jonk:playlist:2ImDreMyt1Py2iXKtmEStW',
'size' => get_option('spotifyplaybutton_size',0),
'sizetype' => get_option('spotifyplaybutton_sizetype','big'),
'link' => get_option('spotifyplaybutton_link','yes'),
), $atts ) );
$size = round($size);
$width = '100%';
$min_height = '';
if ($size != 0) {
$width = $size;
}
if ($sizetype == "compact") {
$height = 80;
$min_height = "min-height:{$height}px;";
} else {
if ($size == 0) {
$height = '500';
} else {
$height = $size+80;
}
}
$open_spotify_link = '';
if ( $link != 'no' ) {
if ( strpos( $play, 'https://' ) !== false ) {
$url = $play;
} else {
$url = str_replace( ":", "/", $play );
$url = str_replace( "spotify/", "https://open.spotify.com/", $url );
}
$url = esc_url( $url );
$open_spotify_link = "<p><a href=\"" . $url . "\" target=\"_blank\">" . __("Open in Spotify", "sptifyplaybutton_text") . "</a></p>";
}
if ( strpos( $play, 'https://' ) !== false ) {
$play = str_replace( "https://open.spotify.com/", "spotify:", $play );
$play = str_replace( "/", ":", $play );
} else {
$play = esc_attr( $play );
}
$width = esc_attr( $width );
$height = esc_attr( $height );
$min_height = esc_attr( $min_height );
return "<iframe src=\"https://open.spotify.com/embed/?uri={$play}\" width=\"{$width}\" height=\"{$height}\" frameBorder=\"0\" allowfullscreen=\"\" allow=\"autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture\" loading=\"lazy\" style=\"max-width:{$width}px;max-height:{$height}px;{$min_height}\"></iframe>" . $open_spotify_link;
}
Code file location:
spotify-play-button-for-wordpress/spotify-play-button-for-wordpress/sptify-play-button-for-wordpress.php
Conclusion
Now that you’ve learned how to embed the Sp*tify Play Button for WordPress Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply