- This extension is enabled by default on Fandom.
The easiest way to embed video from several online video hosting services is to use the Video Embed Tool.
This page documents how to use the older YouTube video extension (which was adapted to embed videos from several other sites) on any Wikia page using simple code. The video is not uploaded to Wikia, but embedded, meaning it is stored on YouTube, then called from there to be viewed on Wikia.
See also Help:Videos for other video-related extensions.
What video sites are supported?
How do I add 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: http://www.youtube.com/watch?v=CCz1kmfqL7g the id code would be CCz1kmfqL7g. If you aren't sure what to use, you can add the whole url in place of the id code.
YouTube videos are embedded using two tags, with the id code for the video you want to show between them:
"id code" is the code from the URL. So in our example, you would use:
Can I display the video at a smaller size?
You can change the width and height of the video box, to a maximum of 640x385 pixels. For best results, the height should be about 3/5 (60%) of the width. Some examples of good ratios include 200x120, 375x275, and 500x300.
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 640 pixels.
- Height is controlled in the same way with
height="xxx". The default is 385 pixels.
A full example would be:
<youtube width="200" height="120">CCz1kmfqL7g</youtube>
| width="500" height="300":|
| width="375" height="225":|
| width="200" height="120":|
Can I hide the video and just use this as an audio player?
If you choose a height of 25 pixels, it will just show the playback controls and not the video. This can be used with the YouTube extension to use it as an audio player rather than a video player, for videos on YouTube, some of which just have static images with music playing. As for the width when using it as an audio player, the full 640 pixel width allows users the easiest control over seeking different parts in the audio, although you can use any width you like, provided it is large enough to fit the basic controls. A width of 150 pixels is the minimum for being able to seek different parts of the audio.
How do I match the aspect ratio of a video?
YouTube videos can use a wide variety of aspect ratios. For older videos, a 4:3 aspect ratio is most common, and for newer videos, a 16:9 aspect ratio is most common. However, the aspect ratio can be almost anything!
To find out the exact aspect ratio of a YouTube video for sure, download the video from YouTube using a tool such as DownloadHelper for Mozilla Firefox or any other YouTube video downloader tool. Then open the file up in a video player (Media Player Classic is a good player that comes with certain codec packs for Microsoft Windows such as K-Lite Codec Pack, while VLC media player is a cross-platform video player that can handle Flash video and does not require a codec pack). After opening the file in a video player that can handle it, look at the file's properties (in Media Player Classic, for example, you find this by going to the File menu and choosing Properties). The properties should list the width and height of the video, with an "x" between the width and the height.
Once you know the width and height of the video, that is not the final step. First, the Wikia YouTube extension's limit for the size of the video itself is 640 for width and 360 for height (since the bottom 25 pixels of the embedded video are NOT for the video itself but for YouTube's 25-pixel-tall toolbar for controlling video playback). The size limit, for the entire embed, including both the video and the toolbar at the bottom, is 640 for width and 385 for height, but remember that the bottom 25 pixels will be used for YouTube's control toolbar.
Generally, it is best to use the maximum height of 360 pixels for the video, and then you perform the following calculation: from your video player, you have the width and height of the original video. Divide the width by the height in a calculator program, such as Windows Calculator, which comes with Microsoft Windows. For instance, suppose the video you downloaded turned out to have a resolution of 720x480. Divide 720 (the width) by 480 (the height). It should be displaying a result, namely the aspect ratio, in this case, 1.5. Now multiply this aspect ratio by the number of pixels you have chosen for the height, which in most cases should be 360. In this case, 1.5 times 360 equals 540. This is the width you want for the video, 540 pixels. As for the height, remember that we chose 360 for the height and that YouTube has a 25-pixel tall toolbar it adds to the bottom, so add 25 to 360 and you get 385. Therefore, the video you embed should have the following parameters, in this case:
<youtube width="540" height="385">video id</youtube>
Remember to put the video id from YouTube in where it says "video id"! Now here are some widths and heights for some of the most common aspect ratios on YouTube:
- 4:3 (0.75 in calculator) ->
- 16:9 (1.7777 with continuing 7's in calculator) - >
- 3:2 (1.5 in calculator) ->
As a final step, once you have successfully embedded the video with the correct width and height to match its aspect ratio, you can delete the downloaded video off your hard drive, if you haven't already.
As a sidenote, if you don't want to go through all of these steps, usually you can just guess the aspect ratio as either being 4:3, 16:9, or 3:2, and use a corresponding width and height, since a majority (but certainly not all) of YouTube's videos do use one of those aspect ratios. An obvious sign that you have guessed correctly is that there is not any area full of nothing but black pixels on the sides of the video or above or below the video. However, some videos have areas full of black pixels along some of their edges, so it is not always obvious if you have guessed correctly or not. This is why doing the full technique to match the aspect ratio is best.
You can add a caption to a video using the image thumbnail styles. You can use all normal wikitext formatting in your caption.
The basic form is:
<div> <div class="thumbcaption">CAPTION</div> <youtube width="200" height="120">ID</youtube> </div>
This code places the caption, in a smaller font, below the video:
<div class="thumb tright" style="width:256px;"> <div class="thumbinner"> <youtube width="200" height="120">ID</youtube> <div class="thumbcaption"> CAPTION </div> </div> </div>
Can I center the video, or move it to the right?
You can control video placement using the image thumbnail style.
In this example you can add a video with a width of 250px, float it to the right of the page, and add a caption at the top. Simply edit the ID and CAPTION and pixel sizes to suit.
<div class="thumb tright" style="width:256px;"> <div class="thumbinner"> <div class="thumbcaption">CAPTION</div> <youtube width="200" height="120">ID</youtube> </div> </div>
Can I use a template to embed videos?
If you intend to use a lot of YouTube videos on your wiki, you can make a template to make adding videos easier, and to display all videos in a standardized way. However, because of the order in which the template and the extension are processed, the <youtube> extension code itself cannot contain template parameters.
Other usable video sites
The video extension also supports several other video hosting sites. Replace "id" with the unique identifier each site uses in their URLs.
<gtrailer width="360" height="300" gtid="33737"/>
An example of a GameTrailers.com video
- Google Video
<gvideo gvid="id" width="width" height="height" />
<gvideo width height>id</>
- Archive.org audio and video
<aovideo aovid width height />
<aoaudio aoaid width height />
- GameTrailers.com video
- Tangler forum
<tangler tid gid />
<tangler> tid | gid </tangler>
Examples of embedded video at Wikia
Are you using video on your Wikia? Please add to the list of examples below to show people how this feature can be used.
- Video clip of English lesson activity on WikiJET
- Videos showing the 3D strategy game Glest
- UnNews is now available on video
- Cisco's Human Networking commercial on the Human Network Wiki
- The Gaiapedia using YouTube videos to show off the battle system teaser video.
- The Gaiapedia using YouTube videos to show off recorded footage from The Otakon 2006 Gaia Online Panel.
- A category about videos in articles (Hungarian Spamwiki)
- Sport, Arts & Culture on Sustainable Community Action
- Psychology wiki listing of clips
- Lord of the Rings parodies
- Subpage showing the latest videos for an upcoming Grand Theft Auto modification
- Redwall Wiki: Introduction themes to various seasons of the Redwall Television Series
- Electrocuting an Elephant at the Spanish Art Wiki
- Kuk Sool Won: Martial Arts in Motion
- Featured Video on the Ghostbusters Wiki main page
- A German example from the Lachfisch-Server
- Videopedia - a Videoportal with a lot of YouTube Videos (German)
- Homeworld wikia shows how weapons work in game - here it's Sajuuk Main Cannon
- Duty & Valour, Canada's Military History Encyclopedia — this wiki uses this extension on its Main Page.
- R'lyeh page on SubGenius Wikia Clench: an example of how to encode a video with a nonstandard aspect ratio (in this case, a 5:4 aspect ratio)