Embed SoundCloud stream
SoundCloud is traditionally known as a music hosting and promotion service for creators, but it can also be used as a no-cost or low-cost repository for any kind of audio file, such as podcasts or oral histories. SoundCloud offers unique URLs for each stream, and support for embedding the stream in other websites. The support for embedding is used in this recipe to integrate SoundCloud’s audio player directly into your CONTENTdm website. This follows a similar pattern used in other embedded recipes for CONTENTdm, like embedding external YouTube or Vimeo videos.
This recipe is structured to work with the CONTENTdm URL Item type, assuming that you have loaded the direct link to a particular SoundCloud stream as a URL item in CONTENTdm. Hear an example of a SoundCloud item here.
The public-facing URL cannot be directly used in the embeddable audio player because the syntax of the embedded URL requires a unique ID number for the item. The unique ID number is assigned by SoundCloud when the audio file is uploaded to their system.
The SoundCloud ID is the track ID number. This number can be found in the embed code (aka <iframe> code) provided by SoundCloud. In the example below, the SoundCloud ID is 385068290.
<iframe width="100%" height="300" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/385068290&color=%23ff5500& auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false& show_teaser=true&visual=true"></iframe>
This recipe has been designed so that you can load your SoundCloud items wherever you prefer. The items can be placed into CONTENTdm collections that contain other kinds of URL items and with any other types of CONTENTdm records.
To install the recipe:
const url = embedSoundCloud.getUrl(identi',currentUrlLink);
', to match the field nickname that corresponds to the metadata field where you are storing the SoundCloud ID.Note: You will need to modify the value, 'identi