Contents:

Playlist is a feature that allows you to embed multiple projects on yoru website or Shopify store in a simple and easy to use format. If you are unfamiliar with the playlist format, please refer to this article for more information.

There are two ways to embed a playlist on a store. Please refer to Method 1 for all Non-Shopify stores, and Method 2 for stores on Shopify.

Once you have created a playlist, configure the playlist settings to your preferences by using the settings tab on the right hand side.

To embed the playlist first you would need to click the '<> EMBED' button, located in the top right of the playlist preview.

Then you would need to copy & paste the two codes on the page where you want the playlist to be.

You can include multiple playlists per page. In this case, you would only need the script on the page once, but multiple playlist IDs (second code).

If you would like to have ‘add to cart’ functionality, please refer to this article [LINK article] in our documentation.

Once you have created a playlist, configure the playlist settings to your preferences by using the settings tab on the right hand side.

To embed the playlist on your Shopify store, click the '<> EMBED' button, located in the top right of the playlist preview. Select the ‘Shopify’ option in the share tab.

At this point, you need to pick the Theme that you would like to embed the project on

If you have not embedded a Smartzer project before, you may be prompted to ‘Click here to enable your SDK’. This allows you to toggle the Smartzer Playlist App Block on.

Once you have toggled on the Smartzer SDK, click save. Return to the Smartzer editor, and you will notice the share tab has been updated. If you do not see a change, check you clicked save in Shopify, then click the ‘I’ve done it’ button.

At this point there are 2 different experiences you may see, depending on if your store supports App Blocks or not.

If you see the below screen, your store supports app blocks. If not, skip to Experience 2 here.

Copy the ID of the project, and click ‘Add Smartzer Player To Store’. This will automatically open your Theme Editor for you, and create a Smartzer Playlist block. If you don’t want the block on that page, you can remove it and add to the page you desire by doing the following:

Add a section to the page you wish to embed the player on. Here, select apps, and select Smartzer Playlist.

Next, paste the Playlist ID into the box. Save the changes and the playlist will now be embedded on the page.

If your store does not support App Blocks, you will see the screen below (once the SDK is switched on). You can embed your playlist via a Custom Content section in this case.

Copy the embed code, and click ‘Go to My Theme Editor’.

This will automatically redirect you to your Shopify store. Check you are on the page you would like to embed the playlist on, then click ‘Add Section’ on the left. Select ‘Custom Content’ from the list.

Once this is added, add a block to your Custom Content section, and select Custom HTML.

Paste the embed code you copied over into the HTML box, and you will see the playlist is now embedded on your store. Configure the container width to your preference. Here we recommend 100%.