| title | subtitle | url | filter |
|---|---|---|---|
| Morning Drive | A bright synth-pop instrumental | https://example.com/audio/morning-drive.mp3 | Electronic |
| Blue Room Sessions | A laid-back jazz trio | https://example.com/audio/blue-room.mp3 | Jazz |
| Open Highway | Guitar-driven rock with a steady backbeat | https://example.com/audio/open-highway.mp3 | Rock |
How to Create an Audio Player Playlist
A step by step walkthrough for turning a spreadsheet of titles and audio links into a published, embeddable playlist in PlotSet, with play buttons, progress bars and category filters.
约 6 分钟A list of tracks with play buttons, progress bars and category filters, built from a spreadsheet and ready to embed: that is what you will have. Each row becomes one playable track, and adding a track later means adding a row.
If you already have direct links to your audio files, it takes about six minutes. The one prerequisite is hosting, since PlotSet streams from the links you give it rather than storing the files.
你需要的数据
One row per track with up to four columns: title, an optional description, a direct audio file URL, and an optional category used for filtering and colour.
The URL must point directly at an audio file such as an MP3, OGG or WAV, not at a page that contains a player.
A row with a title but no link still appears, dimmed and not playable. A row with neither title nor link is dropped.
Keep category spellings identical, or the filter will list the same group twice.
The hosting server must allow direct linking and, ideally, range requests so seeking and the buffered bar work.
操作步骤
PlotSet 中从空白模板到完成图表的具体点击路径。
- 01
Open the Audio template
From the PlotSet dashboard, start a new project and choose Audio from the Other category. It loads with a sample playlist so you can see how each row becomes a track.

每份指南都从这里开始:先选分类,再选模板,不管你要做哪种图表,用的都是同一个网格。 - 02
Prepare your track list
Give each track a title and a direct file link, plus a description and category if you want them. Open each link in a browser tab first to confirm it plays.
- 03
Upload the file, or connect it live
Import a CSV or .xlsx file from the data panel, paste rows from a spreadsheet, or connect a Google Sheet so new tracks appear without re-embedding. The first row is read as the headers.

这里的数据视图取自一个条形图项目。你可以上传 CSV、用「Magic Import」从图片里提取数字,或同步 Google Sheet,每种图表类型的面板都一样。 - 04
Check the column bindings
Confirm which column is the title, the description, the audio URL and the category. This is usually right automatically when the headers are clear.

绑定决定哪一列作标签、哪一列提供数值、哪一列决定颜色。「Auto Binding」(自动绑定)会根据表头推测,所以要核对一遍,别想当然。 - 05
Style the player
Open the Player tab to set the button colour, size and roundness, put it left or right of the text, and show or hide the progress bar. You can also choose one, two or three columns.

Audio Player 的「Preview」标签页。所有样式设置都在红框标出的这个面板里,每个设置各自占一个标签页:外观、标题、脚注,以及这种图表类型特有的选项。 - 06
Add category filters
In the Filter controls tab choose pill buttons, a dropdown or a stepped slider. In the Color tab you can tint the rows by category too.
- 07
Set the size and pagination
Adjust the artboard height so the rows you want fit. Longer lists are paginated with a pager underneath rather than scrolled.
- 08
Publish it or embed it
Publish for a live playlist and copy the embed code for your page. A PNG or PDF export captures only the page of tracks currently showing.

点「Share」,完成的图表就会变成一个公开链接和一段嵌入代码。
从已加载示例数据的 Audio Player 模板开始,再替换成你自己的数据。
打开模板Audio Player 的样式提示
Write short titles
Titles and descriptions truncate to a set number of lines. Keep titles short and let the description carry the detail; the full text appears on hover.
Colour by category
Tinting play buttons by category makes groups recognisable at a glance and makes the legend useful.
Match button size to the page
A larger button is easier to tap on mobile. Check the preview at the phone artboard size.
Order tracks deliberately
Rows play in sheet order, so put the clip you most want heard first.
制作 Audio Player 时的常见错误
A track is dimmed and will not play
The row has a title but no usable link. Check the URL column for blanks, and that it ends in a real audio file.
Clicking play does nothing
The link probably points to a web page, or the host blocks direct linking. Open the URL on its own in a browser tab to test it.
The seek bar will not jump ahead
The server may not support range requests. Host the files somewhere that does, or accept that seeking is limited.
深入了解 Audio Player
不确定 Audio Player 是否是正确选择?查看它是什么、何时使用以及何时不使用。
Audio Player:常见问题
A title and a direct audio file link for each track. A description and a category are optional.
现在制作你的 Audio Player
免费开始,300+ 模板任选。无需信用卡。


