[Help Requested] Adding a HTML5 Audio Player

[audiostore]

Hi Shopify community,

My goal is to add a HTML5 audio player to my store. In order to add the one that I've identified as good for my store (which I found on codecanyon), I need to do two things (i) add HTML code to a page and (ii) upload a javascript folder to my "root folder where the index.html or index.php of my website lives." Step (i) is straightforward. I'm stuck on step (ii). Is it possible to add a javascript folder to my Shopify code/website? If so, where within the liquid structure do I go to do so? I currently have the javascript folder saved locally on my machine - I'm not sure how to add it to Shopify.

Thank you in advance for your willingness to help out. Please let me know if you have any questions.

[Tira]

Hey, @audiostore.

Tira here to help. 

Thanks for sharing your question in the Shopify Community. I understand that you want to add an audio player to your store. It looks like you’ve gone through a third-party and need to add code to your Shopify theme. 

Before adding any customizations to your theme, I highly suggest making a duplicate copy of your theme. Duplicating your theme allows you to have a backup copy should you need to go back to your theme’s coding of how it was before. Check out our help doc with the steps on how to duplicate your theme.

You could add javascript code to the theme.js.liquid theme, but any javascript changes to the theme.js.liquid and any "Assets" files are irreversible, and have no previous versions, so you won’t be able to rollback your theme. 

I did some digging, and to add javascript, you would need to add this to the theme.js.liquid section of your theme’s code. Any new code would need to be added to the bottom of the theme.js.liquid file, as seen in this screenshot here:

.

Another option I found is a suggestion by my colleague, Jason. You could use a third-party music player such as Soundcloud, and use HTML provided from the third-party and add it to a section of your theme. Here is the thread with the steps to add this to your store: How to Add Music or Videos to Site.

I would love to know if this helps you with what you want to achieve. Also, what products are you selling? Let me know and I can provide you with some resources to kickstart your business.

[Chris_Hantis]

Hi There,
If you're looking for an app to solve this issue check out Listen Now! for all your audio player needs.