Appearance
Add audio previews
This guide describes adding audio previews to items in your store.
You can setup Label to play audio previews for items in the product grid. When enabled, placing the cursor over an item in the product grid displays a button to Play/ stop audio. Selecting the button starts/ stops playing an audio preview file associated with the item.
In the following video, audio previewing in enabled on the store's product grid. The audio preview plays/ stops when an item is select from the grid.
Set up audio previews
To set up audio previews:
On your store's admin page, select Settings > Metafields.
On the Metafields page, select Products, and then choose Add definition.
In the Name text box, enter a name for the metafield. This can be any name, for example enter the name Audio preview.
In the Namespace and key text box, enter
label_theme.audio_preview
,Expand the Select content type dropdown, and then select File.
In the Additional rules menu area, select the checkbox to enable the option Accepts all file types.
If prompted, from the Unsaved changes menu, at the top of the page, select Save.
On your store's admin page, select Products.
From the Products list, select a product to use audio previews.
On the product's page, scroll down to Metafields.
Select the area beside the Metafield name you entered previously, and then choose Select file.
Select an audio file from the Files list, and then select Done.
To upload an audio file, select Upload, choose a file to upload, select the uploaded file from the Files list, and then select Done.
For example, select the audio file
example-audio.mp3
.If prompted, from the Unsaved changes menu, at the top or bottom of the page, select Save.
In theme editor, go to Theme settings > Products.
In the Products menu, select the checkbox to enable the Show audio preview option, and then save your changes.
Place your cursor over an item in your store's product grid, and then confirm that the Play/ stop audio button displays over the item.
To upload an audio file for previewing another product, repeat the previous steps 7 to 11.