Difference between revisions of "Embed"

From Reembodied Sound Wiki
Jump to: navigation, search
Line 51: Line 51:
 
* The pasted text will look something like this: <pre><iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe></pre>
 
* The pasted text will look something like this: <pre><iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe></pre>
 
* You only need the part of the code that points to the url of the player and the url of the file. Delete the first part of the code: <pre><iframe width="100%" height="450" scrolling="no" frameborder="no" src="</pre>. Be sure you have included the quotation marks. Also delete the last part of the code after "true" (including the quotation marks): <pre>"></iframe></pre>
 
* You only need the part of the code that points to the url of the player and the url of the file. Delete the first part of the code: <pre><iframe width="100%" height="450" scrolling="no" frameborder="no" src="</pre>. Be sure you have included the quotation marks. Also delete the last part of the code after "true" (including the quotation marks): <pre>"></iframe></pre>
* Your code should now look something like this: <pre>https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true</pre>Note that this is a very long, single string of text - if it wraps at the '''?''', it is simply so it fits on the page - there is no break in the text.<br>
+
* Your code should now look something like this: <pre>https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true</pre>(Note that this is a very long, single string of text - if it wraps at the '''?''', it is simply so it fits on the page - there is no break in the text.)
 
* This is the code that needs to be pasted into '''url''' parameter in the Iframe widget.  
 
* This is the code that needs to be pasted into '''url''' parameter in the Iframe widget.  
  

Revision as of 21:35, 22 March 2016

Uploaded Files

pictures

Pictures can be embedded using the standard MediaWiki syntax:

[[File:Hands-on.jpg|120px]]

embeds the picture:
Hands-on.jpg

media files

Most media files can use Html5Media player. For an uploaded file use the MediaWiki syntax within the Html5Mediaplayer tags.:

<html5media>File:Gigue-Leonarda.mp3</html5media>

<html5media>File:Gigue-Leonarda.mp3</html5media>
However, it is recommended that large media files (such as work examples) be embedded from other sources.

Embedding from another source

audio files

The Html5Media player can also stream media files hosted on other servers by using the url of the file. For example, this file is hosted on www.matthewgoodheart.com:

<html5media>http://www.matthewgoodheart.com/music/zenitwasmeant.mp3</html5media>

produces:
<html5media>http://www.matthewgoodheart.com/music/zenitwasmeant.mp3</html5media>


YouTube

This is a linked YouTube video. Note that you can use "height=" and "width=" to create the size player that you would like :

<html5media height="180" width="320">https://www.youtube.com/watch?v=ovASq1-TfF0</html5media>

<html5media height="180" width="320">https://www.youtube.com/watch?v=ovASq1-TfF0</html5media>

Vimeo

For Vimeo videos, use a widget. For this, you will need the id# of the Vimeo video you would like to embed. The id # is the number at the end of the video page url: e.g. https://vimeo.com/29978729 <= id number is is 29978729

{{#widget:Vimeo|id=29978729|height=180|width=320}}


{{#widget:Vimeo|id=29978729|height=180|width=320}}

If you do not have a Vimeo or YouTube account, contact the administrator, and we may be able to upload it to the Evolving Door Music Vimeo or YouTube channel.

Sound Cloud files

Sound Cloud files can be embedded using the Iframe widget.

{{#widget:Iframe |url=https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true |width=810 |height=100 }}

To embed a Sound Cloud file:

To embed a Sound cloud file, you need the url of the Sound Cloud player and your file. To do this:

  • Go to the page of the Sound Cloud file you would like to embed.
  • Click on the "share" button.
  • Click on "Embed."
  • Copy the text that appears in the box below "Code and preview." (Do NOT check the "WordPress Code" box. )
  • Paste the copied text to the wiki page you would like to embed your file on.
  • The pasted text will look something like this:
    <iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true"></iframe>
  • You only need the part of the code that points to the url of the player and the url of the file. Delete the first part of the code:
    <iframe width="100%" height="450" scrolling="no" frameborder="no" src="
    . Be sure you have included the quotation marks. Also delete the last part of the code after "true" (including the quotation marks):
    "></iframe>
  • Your code should now look something like this:
    https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true
    (Note that this is a very long, single string of text - if it wraps at the ?, it is simply so it fits on the page - there is no break in the text.)
  • This is the code that needs to be pasted into url parameter in the Iframe widget.
{{#widget:Iframe
|url= PASTE URL CODE HERE
|width=410
|height=342
|border=0
}}

Example:

{{#widget:Iframe
|url='https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/250492118&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true
|width=410
|height=342
|border=0
}}