Custom fields help you add any piece of information to your audio attachments. The whole concept of placeholders revolves around the metadata stored for each audio attachment. Audio attachments, like any other post type, are stored in the wp_posts
table of the database and their metadata get stored in the wp_postmeta
table. Metadata and placeholders are directly connected: if you have a piece of metadata with meta_key
“title”, its value can be shown by simply adding the %title%
placeholder anywhere in the info templates.
Adding custom fields
WavePlayer 3 includes a new feature that allows you to easily expand the factory placeholders with your own custom ones. If you go to the Placeholders page of the WavePlayer settings, you can find the “Audio Attachment Custom Fields” section. To add a new custom field, simply click on the Add Custom Field button and configure the options of the field you want to add:
- the label describing the field in the Attachment Details modal dialog
- the name used for both the
meta_key
in the database and theplaceholder
in the templates - the type of the field, chosen among
text
,textarea
,checkbox
,radio
,select
,time
,date
,number
- the default value that will be used by default for the custom field
- a comma-separated list of options to pick from, in case the type is either
radio
orselect
In the screenshot above, we added a lyrics_url custom field. That would give us the possibility to use a %lyrics_url% placeholder anywhere in the info templates. The value held by the custom field can be saved in the Attachment Details modal dialog that opens up when clicking on any audio attachment in the Media Library. In the following screenshot, you can see how three different custom fields – AJ Author URL, AJ Track URL and Lyrics URL – can be defined for each audio attachment so that they are replaced to the appropriate placeholder in the player.
Using custom fields
Once the custom fields are added, they can be used in the info templates to expose that information in the player. For example, the following code would add a text LYRICS linking to the URL found in the lyrics_url
meta_key of each audio attachment:
<a href="%lyrics_url%">LYRICS</a>
while the following code would add the feather icon from the Font Awesome icon set as with a link pointing to the URL stored in the lyrics_url
meta_key of the audio attachment.
%lyrics_icon{"url":"%lyrics_url%","icon":"fas fa-feather"}%
In regards to the last code example, please note that the lyrics_icon
placeholder is merely a container that allows us to define the attributes of the button but it is not necessarily connected to any piece of metadata. What’s important, in this case, is that the url
attribute of the icon is defined as the lyrics_url
metadata we defined earlier.
For more information about how to use the placeholders, you can read this article.