How to embed a SoundCloud track in Wordpress

Adding audio track to your site can make the site be more interesting and attractive. However, WordPress is not a musician or having any tools for you to compose music directly on the website therefore you need to rely on a third party which we highly recommend SoundCloud.

SoundCloud is an online music sharing and digital audio streaming platform that enables people to listen and share millions of songs from all over the world and also upload their own ones. Since WordPress and SoundCloud have collarborated to provide an easy-to-use inserting method in order to make things simple to share music from SoundCloud to blogs, users now totally can easily embed a worldwide song or upload their own music to SoundCloud then add it to their sites. By this amazing service, people are able to build a lively and fascinating blog website of their own which not only contain their hobbies but also make others feel it more attractive. Nevertheless, note down that SoundCloud only supports the uploading of AIFF, WAVE, FLAC, OGG, MP2, MP3, AAC, AMR, and WMA files.

If you are looking for an instruction to insert a SoundCloud track onto your blog website, so here is the solution for you. The upcoming guidance will help you to make the online audios available on your Wordpress in a very simple way.

Table of Contents:

Embed a SoundCloud Track

Go to SoundCloud to find the track that you would like to embed. After located the song, find the Share button. Take the song Clair De Lune as an example.

Note: If you cannot see the Share button of that audio, which means it is available to listen only on SoundCloud website.

how to embed a soundcloud track

Copy the URL in the Share tab.

how to embed a soundcloud track

Move to the WordPress.com website. In the WordPress Editor, add a new SoundCloud Block either through the Plus Icon or by typing /soundcloud in a new paragraph. Paste the Share URL to the Soundcloud track into the SoundCloud Block and click Embed. The thumbnail for the SoundCloud track will appear in your editor.

Note: You can also paste the URL directly into a new paragraph and WordPress will turn it into the Soundcloud block for you.

how to embed a soundcloud track

SoundCloud Shortcode

Shortcode is to help you with controlling over how the Soundcloud embed looks and performs. Copy the Share URL from the SoundCloud track and then add a Shortcode Block in the WordPress Editor. Fill in the Shortcode Block the following code:

[soundcloud url="https://soundcloud.com/claude-debussy/clair-de-lune"]

You can replace “https://soundcloud.com/claude-debussy/clair-de-lune” with the URL of the track you want to show on your site.

Customize Shortcode

You can manually customize the shortcode, just follow the upcoming options.

The “params” parameter will pass the given options on to the player widget. The player accepts the following parameter options:

auto_play = (true or false) will determine whether the track will automatically start playing upon load. (This parameter doesn’t work on mobile devices due to the fact that Soundcloud doesn’t support autoplay in them).

width/height = (px/%) will determine the dimensions of the player in pixels or relative percentage to the parent container.

color = (color hex code) will paint the play button, waveform and selections in this color

visual = (true or false) will determine if the player uses the new visual Soundcloud player. (This parameter must be set to false for the color parameter to work.)

Taking an example of a Soundcloud player which doesn’t allow the track to automatically play, has the default width and height of 450, etc.:

[soundcloud url="https://soundcloud.com/claude-debussy/clair-de-lune" params="auto_play=false&hide_related=false&visual=true" width="100%" height="450" iframe="true" /]

This is how the player looks when the first display option is selected.

how to embed a soundcloud track

And this is how the player looks when the second display option is selected and color is 00cc11 (green).

[soundcloud url="https://soundcloud.com/claude-debussy/clair-de-lune" params="color=00cc11&auto_play=false&hide_related=false&show_artwork=true&visual=false" width="100%" height="166" iframe="true" /]

how to embed a soundcloud track

Conclusion

The preceding step-by-step instruction is to help you to insert a SoundCloud audio into your WordPress website by using URL and shortcode. We hope that the guidance is helpful for you to share the great music to others. Please let us know if there is any problem so far.