This guide will walk you through the complete setup processโfrom download to adding your custom audio player to your Shopify store using no coding.
โ Step 1: Download & Prepare Your Snippet #
After your purchase, you received a ZIP file. Inside it, youโll find:
- ๐น
Snippet Code(e.g.,sound-kit-wave-player.liquid) - ๐ This instruction guide (PDF or TXT)
- ๐ต Optional audio demo file (MP3 or WAV) for testing
๐ How to Prepare: #
- Unzip the file
- Windows: Right-click > Extract All
- Mac: Double-click the ZIP file
- Open the snippet code file in a text editor like Notepad, VS Code, or TextEdit
- Copy the entire code โ youโll paste this into Shopify in the next step
โ Step 2: Add the Snippet to Your Shopify Product Page #
You can display this snippet on all products or only on selected ones using templates.
๐น Option A: Add to All Product Pages #
- Go to Online Store > Themes > Customize
- At the top dropdown, select Products > Default product
- In the left panel, scroll down to Product Information
- Click โAdd Blockโ โ choose Custom Liquid
- Paste the code you copied in Step 1
- (Optional) Drag the block to the position you prefer (e.g., below title or description)
- Click Save
โ Done! Your player will now show on all products.
๐น Option B: Create a Custom Template (for Specific Products Only) #
- In the same Customize view, click the three dots (โฎ) next to the current template name
- Click โCreate templateโ
- Name it something like
beatifyy-playerโ Based on: Default product โ Click Create - Add a Custom Liquid block and paste your code as before
- Click Save
Then:
- Go to Products > [Your Product]
- On the right side, under Theme Template, choose
product.beatifyy-player - Save the product
Now only selected products will use the custom player.
โ Step 3: Create a Metafield to Link Audio Files #
To dynamically connect your audio file to each product:
๐งฉ Create the Metafield #
- Go to Shopify Admin > Settings > Custom Data > Products
- Click โAdd definitionโ
- Name it:
Demo Audio File - Namespace & Key:
audio.demo - Type: File
- Save the definition
๐ต Upload the Audio File for Each Product #
- Go to Products
- Click on any product you want to update
- Scroll down to the Metafields section
- Upload your audio file in the Demo Audio File field
Once saved, your snippet will pull the audio from this metafield automatically.
๐ Youโre All Set! #
Your Beatifyy snippet is now live and playing your demo audio per product.
No coding, no extra appsโjust smooth audio previews for beats or sound kits.
๐ฌ Need Help? #
If you need hands-on help or want us to install the snippet for you, email us at:
๐ง in**@******yy.com
๐ www.beatifyy.com