CMS: Connecting the Wix Audio Player to a Collection

5 min read
CMS allows you to store a huge number of files in a collection and play them in the Wix Audio Player. The collection of files connects to a dataset, which connects to the Wix Audio Player. In the dataset, you can add filters and sorting to determine which files play and in which order.
A screenshot of a Wix audio player on a page with a dataset connected and highlighted.

Step 1 | Create a collection

Creating a collection allows you to easily manage your site's content like text, images, files and more. 

To create a collection:

  1. Go to CMS in your site's dashboard.
  2. Click the relevant collection.
  3. Click Create a Collection.
  4. Enter a name for your collection and click Create
  5. Click Manage Fields.
  6. Click + Add Field.
  7. Under the Field type drop-down, select Audio.
  8. Enter a name for this field.
  9. (Optional) Update the Field ID and add help text that appears only in your collection.
  10. Click Save.
  11. Click + Add Item to add a new row where you'll add your first audio file. 
  12. Click the field under Audio, then click the Add Track icon .
  13. Upload the audio file you want to use and click Add Track
  14. Enter the title of the track in the Title field. 
  15. Click + Add Item to continue adding as many files to your collection as you want.
    Tip: You can also click the Add Field icon to add more details to your collection (e.g. artist, genre, cover art). 
A screenshot of a collection containing audio tracks and track information. The Manage Fields panel is also displayed.

Step 2 | Add a dataset

Now you're done setting up your collection, the next step is to add a dataset and connect it to your collection.
New datasets experience:
In Wix Studio, we've moved datasets to the Inspector panel on the right to make them easier for you to use. Learn more about the new datasets experience in Wix Studio

To add a dataset:

  1. Go to CMS in your Editor:
    • Wix Editor: Click the CMS icon on the left of the Editor.
    • Editor X: Click the CMS icon at the top of Editor X.
  2. Click the Add Content Elements tab.
  3. Click the Add icon next to the Dataset.  
  4. Click Settings on the dataset.
  5. Click the Connect a collection drop-down and select your new collection.
A screenshot of a dataset on a page with the Dataset Settings panel open.

Step 3 | Add and connect the audio player to the dataset

Once you've created the collection, and also connected the dataset to your collection, you're ready to connect the audio player to the dataset. 

To add and connect the audio player:

  1. Go to the Add panel:
    • Wix Editor: Click Add Elements  on the left side of the Editor.
    • Editor X: Click Add Elements  at the top of Editor X.
  2. Click Video & Music.
  3. Click Audio Players.
  4. Click and drag the audio player of your choice onto your page.
  5. Click the Connect to Data icon.
    Note: Connection Options vary depending on the type of audio player selected.
  6. Click the Connect a dataset drop-down and select the dataset that you want to connect your audio player to.
  7. Under Connection Options, connect the relevant options to the fields in your collection. 
A screenshot of an audio player on a page, with the Connect to Data panel open and the Connection Options set up.

Step 4 | Set up a filter in the dataset

Use a filter in your dataset to select the track that plays on the audio player. In this case, we use the track title in the filter.

To set up a filter:

  1. Click the dataset on your page.
  2. Click Settings.
  3. Click + Add Filter.
  4. Under the Field drop-down, select the field containing the name of your track. In this case, we choose Track title (text).
  5. Under the Condition drop-down, select Contains.
  6. In the Value field, enter a word or phase unique to the track you want to play.
  7. Click Add Filter.
  8. Click Preview to hear your audio player in action.
A screenshot of the Dataset Settings panel with the Edit Filter options on display.

Did this help?

|