How to add a music player to your Shopify store

Sell Online With Shopify
Trusted by millions of businesses worldwide
Sign up for a free trial and enjoy 3 months of Shopify for $1/month on select plans.

We recommends using SoundCloud for adding a music or audio player to your store. You can upload your own audio files to SoundCloud and then embed a player on your store.

Step 1 – Create a SoundCloud account

Go to SoundCloud and enter your information to either create a new account or sign into your existing account.

Step 2 – Upload your music

After setting up your account, you can click on the Upload link to start adding songs or audio files to your account. Free SoundCloud accounts can upload up to 180 minutes of audio. If you need more than that, consider upgrading to SoundCloud Pro or trying one of the alternative options.

At this point, you can either record a new audio file right into SoundCloud using the microphone on your computer or you can upload an existing audio file. They support all standard audio formats and can accept files up to 5GB in size.

You can upload album artwork and fill in any information about the song, artist, and genre. Save when you are done.

Step 3 – Get the embed code

SoundCloud will present you with a link to where your new audio track is located. Here you can play your audio file and others can comment on it.

Look for the share icon and press it to see the available options.

Click on the Embed option.

Select which player option you prefer. There are additional options at the bottom.

After you have the player configured the way you like, copy the code in the Code and preview box.

We strongly discourage you from enabling automatic play for any audio or video on your website. Several studies show that having media playing without a visitor pressing a play button will drive people away from your website.

Step 4 – Paste the code into a element

Log in to your Shopify store. From your Shopify admin, go to Online Store > Themes. Click Actions > Edit code. In the Layouts folder, locate and click on the liquid file want to insert to open it in the online code editor and paste this code.

If you would like the player to appear on all pages, you can add the music player to the footer of your template.

Alternative music player options:

  • HearThis (similar to SoundCloud)
  • PodSnack (create custom players)
  • BandCamp (you can also sell your music online)
  • Tindeck (player somewhat difficult to resize)
  • 8Tracks (only works for music mixes)
  • Spotify (add a playlist to your website)

Looking for Shopify Experts?

Hura Apps can help you take your store to the next level

Our team of experienced designers and developers can help you create a beautiful, high-converting Shopify store that will drive sales and increase customer satisfaction. From custom design to app development and optimization, we have the skills and expertise to help you achieve your eCommerce goals.

Get in touch

You may also like...

1 Response

  1. kevin says:

    where exactly to add the embed code, can i use anchor embed code?

Leave a Reply

Your email address will not be published. Required fields are marked *