[audio] and [audio_controls] BBCodes

Post Reply
User avatar
Dave Keenan
Site Admin
Posts: 2085
Joined: Tue Sep 01, 2015 2:59 pm
Location: Brisbane, Queensland, Australia
Contact:

[audio] and [audio_controls] BBCodes

Post by Dave Keenan »

The [audio] and [audio_controls] BBCodes have existed in this forum for some time, but have not been explained before this.

The first has the form

[audio=url] text [/audio]

It creates a link with the text "text" that plays the entire audio file at "url" when clicked or tapped. You would typically only use this for audio clips of a few seconds duration. The "text" can also be a smiley, an emoji, or an image (enclosed in [img] or [image=width] tags). The audio file format can be .mp3, .wav or .ogg. To play midi files (.mid) use the [midi] BBCode instead.

The second has the form

[audio_controls=url] text [/audio_controls]

It embeds a set of audio controls that allows the playing of the audio file to be started and stopped. In this case the "text" will only be shown as a tooltip when you hover over the controls, or if the browser does not support audio controls. If you want a title for the controls, just include it as ordinary text before or after the BBCode.

You can upload the audio file as an attachment to the post in which it plays. You must then obtain the URL of the attachment, for inclusion in the [audio] or [audio_controls] BBCode. You can do this before submitting the post, by clicking on the Attachments tab below the edit pane, right-clicking on the file-name, and choosing Copy link location or similar. The file-names don't look like links until you hover over them.

Examples:

[audio=http://www.bestII.com/~mschulter/NIA002-337.829.mp3]:smiley_cat:[/audio]

:smiley_cat:


[audio_controls=http://forum.sagittal.org/download/file.php?id=151]improv29.mp3[/audio_controls]
George Secor 29-edo improv


George Secor 29-edo improv

User avatar
Dave Keenan
Site Admin
Posts: 2085
Joined: Tue Sep 01, 2015 2:59 pm
Location: Brisbane, Queensland, Australia
Contact:

Re: [audio] and [audio_controls] BBCodes

Post by Dave Keenan »

For those waning to implement these BBCodes in other forums, here are the patterns, replacements and help lines:


[audio={URL}]{TEXT}[/audio]

<audio id="{URL}" src="{URL}"></audio><a href="#!" onclick="document.getElementById('{URL}').play()" class="postlink">{TEXT}</a>

Create a link that plays an audio file: [audio=http://audio.file]text[/audio]


[audio_controls={URL}]{TEXT}[/audio_controls]

<audio controls src="{URL}" title="{TEXT}">{TEXT}</audio>

Embed controls to play an audio file: [audio_controls=http://audio.file]tooltip[/audio_controls]

Post Reply