Plugins
Templates

Spotify Embed Plugin

Link to plugin page: https://zeroqode.com/plugin/spotify-embed-1610534195919x468424643991938800

Introduction

Spotify Embed plugin provide an embeddable view of a track, artist, album, user, playlist, podcast or episode for use within your web project.

It comes with two elements for two kinds of widgets - the Spotify Embed and the Follow Button.

Prerequisites:

No prerequisites are required.

How to Setup

Place the 'Spotify Embed' and/or 'Spotify Follow' plugin element on the page and set its properties according to your requirements.

Plugin Elements

The plugin contains 2 visual elements, 'Spotify Embed' and 'Spotify Follow', that can be used on the page.

Spotify Embed element

Element properties:

1. What to embed - dropdown. Choose an entity to embed. Available values: album, track, artist, playlist. The default value is 'album'.

2. ID (type: text) - id of the entity to be embedded.

3. Widget width (type: number) - width of the Spotify widget.

4. Widget height (type: number) - height of the Spotify widget.

Element actions, states, events:

This plugin element has no actions, states or events associated with it.

Spotify Follow element

Element properties:

1. Artist ID (type: text) - ID of the artist to follow.

2. Button width (type: number) - width of the Follow button.

3. Button height (type: number) - height of the Follow button.

4. Button layout - dropdown. Choose the layout to be used for the button. Available values: basic, detail. The default value is 'basic'.

5. Page theme - dropdown. Choose the theme to be applied to the button. Available values: light, dark. The default value is 'light'. NB: This property has effect only when the 'Button layout' property is set to 'detail'.

6. Show followers count - checkbox. Indicates whether to show followers count on the button.

Element actions, states, events:

This plugin element has no actions, states or events associated with it.

Plugin setup examples

  1. Example Spotify Embed setup

2. Example Spotify Follow setup

Please note, that the background color of the widget is set by Spotify based on the "context"-image (artist, album, playlist). If you want to change the background color, try changing the "context"-image to something similar to your web app color scheme.

Also note that for users who are not logged in on their Spotify account, the Spotify Embed plays a 30-second long audio preview, and then the users are prompted to either login or to sign up.

Demo to preview the settings