Widget:SC: Difference between revisions
No edit summary |
No edit summary |
||
| Line 2: | Line 2: | ||
==Description== | ==Description== | ||
[[File:Sc-share-pic.png|thumbnail|How to get the link for SC widget]] | [[File:Sc-share-pic.png|thumbnail|How to get the link for SC widget]] | ||
This widget allows you to embed audio hosted on '''[http://www.soundcloud.com/ SoundCloud]'''. It | This widget allows you to embed audio hosted on '''[http://www.soundcloud.com/ SoundCloud]'''. It generates all necessary HTML markup and creates a minimalistic HTML5/Flash (depending on the client's browser capabilities) player with "Play/Pause" button and name of the audio you are embedding. You should pass one required parameter to the widget. It is absolute URL of the audio (which is easy to obtain from SoundCloud "Share' options). | ||
The mini player is supposed to be very compact and not to make the page overloaded with unnecessary elements. | The mini player is supposed to be very compact and not to make the page overloaded with unnecessary elements. | ||
| Line 14: | Line 14: | ||
<p>Where:</p> | <p>Where:</p> | ||
<p>''link'' -- URL of the audio file you can find on SoundCloud (see the image)</p> | <p>''link'' -- URL of the audio file you can find on SoundCloud (see the image)</p> | ||
</noinclude> | </noinclude> | ||
<includeonly> | <includeonly> | ||
<a href="<!--{$link|default:'#'|escape:'html'}-->" class="sc-player" | <a href="<!--{$link|default:'#'|escape:'html'}-->" class="sc-player"></a> | ||
</includeonly> | </includeonly> | ||
Revision as of 17:16, 5 February 2014
Description
This widget allows you to embed audio hosted on SoundCloud. It generates all necessary HTML markup and creates a minimalistic HTML5/Flash (depending on the client's browser capabilities) player with "Play/Pause" button and name of the audio you are embedding. You should pass one required parameter to the widget. It is absolute URL of the audio (which is easy to obtain from SoundCloud "Share' options).
The mini player is supposed to be very compact and not to make the page overloaded with unnecessary elements.
JavaScript engine and stylesheets for this widget are located in common.js and common.css respectively and can (should) be changed as needed. This widget uses jQuery library, SoundCloud API connector and jQuery plugin The SoundCloud Custom Player.
Usage
The widget code looks like this:
{{#widget:SC|link=YOUR_URL|width=YOUR_WIDTH}}
Where:
link -- URL of the audio file you can find on SoundCloud (see the image)
