Soundcloud Element

Last Update: August 30, 2025

The Avada Soundcloud Element allows you to embed a SoundCloud track directly into your page easily. You can choose the layout of the track, as well as display various metadata.

Watch the video below for a visual overview of the Element, view the Avada SoundCloud Element page for live examples, and read on to see the complete list of options.

For privacy reasons YouTube needs your permission to be loaded.
View Element Page!
View Live Example!
View Avada Builder Elements!

How To Use The SoundCloud Element

The Avada SoundCloud Element allows you to embed SoundCloud files anywhere on your site quickly. To start, add the Element to your desired Column. Using the SoundCloud Element is very easy. Firstly, add the URL to the SoundCloud file you wish to embed, and then choose the layout.

There are also options for showing related items, users, and comments (these can only be turned off on tracks uploaded with a Pro Plan), as well as some styling and sizing options.

Element Options

HeadingDescription
SoundCloud UrlThe SoundCloud url, ex: https://soundcloud.com/dani-pop-shocr-n/miles-davis-smoke-gets-in-your.
LayoutChoose the layout of the soundcloud embed.
Show CommentsChoose to display comments. NOTE: This feature can only be turned off on tracks uploaded through a SoundCloud pro plan.
Show RelatedChoose to display related items. NOTE: This feature can only be turned off on tracks uploaded through a SoundCloud pro plan.
Show UserChoose to display the user who posted the item. NOTE: This feature can only be turned off on tracks uploaded through a SoundCloud pro plan.
AutoplayChoose to autoplay the track. NOTE: SoundCloud does not allow autoplay on mobile devices.
ColorSelect the color of the element.
DimensionsWidth can be specified in pixels (px) or percentage (%) values, height in pixels (px) only.
MarginEnter values including any valid CSS unit, ex: 4%.
Element VisibilityChoose to show or hide the element on small, medium or large screens. You can choose more than one at a time.
CSS ClassAdd a class to the wrapping HTML element.
CSS IDAdd an ID to the wrapping HTML element.

In this article