View source for Help:Adding YouTube videos

You can '''add YouTube videos''' on any page by using simple code. The video is not uploaded to the wiki, but ''embedded''.  This means it is stored on YouTube, then called from there to be viewed on the wiki.

==Adding a YouTube video==
To add a YouTube video, you need the id code for the video.  The easiest way to find this is to look at the URL of the You Tube page for the video.  The string of letters and numbers after "v=" in the URL is the id code.  So for the URL: '''<nowiki>https://www.youtube.com/watch?v=dI7uafSOe8I</nowiki>''' the id code could be '''dI7uafSOe8I'''.  If you aren't sure what you use, you can add the whole URL in place of the id code.

YouTube videos are embedded with the code: 

 <nowiki><youtube></youtube></nowiki>

The id code for the video you want to show goes between the two tags:

 <nowiki><youtube>id code</youtube></nowiki> 

"id code" is the code from the URL.  So an example might be:

 <nowiki><youtube>dI7uafSOe8I</youtube></nowiki> 

===Changing the size of the video===
You can change the width and height of the video box, to a maximum of 425x350 pixels.  If you specify width ''and'' height, and those settings are not in proportion to the YouTube screen, then you will have empty space around the video.  In most cases, the width determines the screen size in this situation.

* Width is controlled with width="xxx", where xxx is the number of pixels.  The default is 425 pixels.
* Height is controlled in the same way with height="xxx".  The default is 350 pixels.

A full example would be:

 <nowiki><youtube width="200" height="200">dI7uafSOe8I</youtube></nowiki>

This gives you:
 
<youtube width="200" height="200">dI7uafSOe8I</youtube>

==Adding a caption==
You can add a caption to a video using the image thumbnail styles. 

The basic form is:
<pre>
<div>
<div class="thumbcaption">CAPTION GOES HERE</div>
<youtube width="125" height="100">ID GOES HERE</youtube>
</div>
</pre>

==Controlling placement==
You can control where you want to place the video again using the image thumbnail style.

In this example you can add a video with a width of 200px, float it to the right of the page, and add a caption at the top. Simply edit the ID GOES HERE and CAPTION GOES HERE and pixel sizes to suit. 

<pre>
<div class="thumb tright" style="width:200px;">
<div class="thumbcaption">CAPTION GOES HERE</div>
<youtube width="200" height="200">ID GOES HERE</youtube>
</div>
</pre>

==Placing the caption below the video==
You can use the following code to place the caption, in a smaller font, below the video:

<pre>
{| align="right"
|-
|<youtube width="200" height="200">ID</youtube><br />
<small>CAPTION GOES HERE</small> 
|}
</pre>

{{Help}}