Spy on Your Competitors - Extended Free Trial!  GO!
How to Insert Audio Files With the Rich Text Editor on Shopify

How to Insert Audio Files With the Rich Text Editor on Shopify

Last modified: December 3, 2021

FAQ
Shopify Trial

Do you have products that have audio aspects to them? Perhaps you sell CDs of your own music or you have products that contain a musical element. You might want to include a preview of these sounds on your Shopify store.

Or, perhaps you’ve moved into podcasting and would like to showcase your shows on your website. The more people that view the content on your website, the better the results might be from your website.

With Shopify, you’re allowed to insert audio filed within the rich text editor to any part of your content. This allows you to showcase the content that you would like to promote. There are lots of factors that can cause problems, but these can be easily overcome, there are also apps that can help you. For instance, you could use this app to add media players to your website.

However, if you want to do it for free, here are some instructions for you.

Recommended: Top 9 Shopify Audio Player Apps

# Name Image
Shopify
Shopify
More Info
1
Widgetic (Audio Players)
Widgetic (Audio Players)
More Info
2
Osaria Audio Player
Osaria Audio Player
More Info
3
Star Audio Player
Star Audio Player
More Info
4
Music Player by Websyms
Music Player by Websyms
More Info
5
Custom Background Music
Custom Background Music
More Info
6
Elfsight Podcast Player
Elfsight Podcast Player
More Info
7
Elfsight Background Music
Elfsight Background Music
More Info
8
Elfsight Radio Player
Elfsight Radio Player
More Info
9
Speakease Reader
Speakease Reader
More Info
Show More
Click here for more information about Top 9 Shopify Audio Player Apps.

Step 1 – Log In

The first step is to log into your Shopify store with your user credentials.

Step 2 - Settings

After entering your main admin area, you need to click on the ‘Settings’ area that is at the bottom left corner of the menu. Then you need to select the ‘Files’ option.

Step 3 – Upload

Look in the top right corner of the screen and then click on the option that reads ‘Upload files’, this is where you’re going to add the audio file you would like on your website. After uploading the files you will be given a URL, this is the URL that is for the audio file, you need to keep a record of this.

Step 4 – Add Audio File to Page

Now you need to go to the page where you would like to add the link to the audio page. On the page/post, find the text where you would like to insert the link and highlight it.

Then you need to add the code inside the text editor to embed the audio player (remember text editor not rich text editor).

<div id="player"><audio controls="controls">
<source src="xxxx" type="audio/mpeg" /></div>

Remember to replace the xxxx with the URL of the audio that you wanted to insert into the page. Otherwise, nothing will display.

The URL of the audio file that is uploaded will begin with cdn.shopify.com and not your own address. It is important to remember that.

Step 5 – Save

Now that you’ve added the media player and the audio extract to the page, you can save the page. This will confirm changes. You can also test the audio player by visiting the page as a guest.

Final Word: How to Insert Audio Files With the Rich Text Editor on Shopify

Inserting an audio file with the rich text editor on Shopify is really simple. It is a two-stage process but one that can be done within minutes. Alternatively, you can use a number of apps that allow you to add media to your website within nice interfaces that are simple to use.

Recap:
Read More
Got Something To Say?

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

Free Trial