A number of pages on my site must include an audio player that allows visitors to play a self-hosted track that relates specifically to the viewed page. Normally I would embed the following html to the player's engine straight into the page's code but with Silverstripe's WYSIWYG Editor that's not an option, as it rejects the inclusion of 'copied-in' code in html viewing mode.
I have not yet investigated whether it's possible to modify the editor to accept 'copied-in' code; not sure whether that could be an option too...
So, I am now looking for ways to inject code - such as the following - through my WYSIWYG in the appropriate pages:
<!-- Start of audio player body section html codes -->
<div id="AUDIOPLAYER_ID" style="display:block;position:relative;width:360px;height:auto;margin:0px auto 0px;">
<ul class="AUDIOPLAYER_CLASS" style="display:none;">
<li data-artist="TRACK_ARTIST" data-title="TRACK_TITLE" data-album="ALBUM_NAME" data-info="TRACK_INFO" data-image="TRACK_IMAGE" data- duration="TRACK_MINS">
<div class="TRACKSOURCE" data-src="SELF_HOST_TRACK_URL" data-type="audio/mpeg" />
</li>
</ul>
</div>
<!-- End of body section HTML codes -->
Note: For what it's worth, each audio player will have its own ID "AUDIOPLAYER_ID" to ensure pages can hold multiple players.
Can anyone share any wisdom on how to achieve this best, either through shortcodes or through a WYSIWYG intervention?
Heaps of thanks in advance!
