This is a wiki for a reason. Anyone can contribute. If you see something that is inaccurate or can be improved, don't ask that it be fixed--just improve it.
[ Disclaimer, Create new user --- Wiki markup help, Install P99 ]

Difference between revisions of "Template:Youtube"

From Project 1999 Wiki
Jump to: navigation, search
(IMPORTANT NOTE: URLs Must Be "Embed" URLs)
(Example #3: Longer Version: Specific Dimensions)
 
(14 intermediate revisions by one user not shown)
Line 1: Line 1:
 
<noinclude>
 
<noinclude>
This template allows you to embed a Youtube video in a page.
+
This template allows you to embed a Youtube video in a page.  To use it you simply provide the ID of a Youtube video, and optionally a height and width.
  
== IMPORTANT NOTE: URLs Must Be "Embed" URLs ==
+
Although you can use this template anywhere (that is appropriate) in the wiki, the [[Videos]] page is one great place to start.
  
The URL used ''must'' be an "embed" URL (ie. it should start with the Youtube URL, followed by "/embed/", then the video ID).  You can get this URL by right-clicking on a Youtube video and choosing "Copy Embed Code".  This will copy code like:
+
== Finding a Video's ID ==
  
<code><nowiki><iframe width="300" height="150" src="https://www.youtube.com/embed/CBttHicGbek" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></nowiki></code>
+
Every Youtube video includes its ID in its URL.  For instance, if you right click on the Green Trailer video and choose "Copy video URL", you'd get the URL:
  
You want the URL inside the src="" part.  In other words, you want:
+
<code><nowiki>https://youtu.be/CBttHicGbek</nowiki></code>
  
<code><nowiki><iframe width="300" height="150" src="</nowiki></code>'''https://www.youtube.com/embed/CBttHicGbek'''<code><nowiki>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></nowiki></code>
+
The ID is the part after "https://youtu.be/", in other words:
 +
 
 +
<code><nowiki>https://youtu.be/</nowiki></code>'''CBttHicGbek'''
 +
 
 +
Other Youtube URLs may put it elsewhere, but it always be present.  For instance, if you visit the Youtube page for that video, it will take you to:
 +
 
 +
<code><nowiki>https://www.youtube.com/watch?v=</nowiki></code>'''CBttHicGbek'''
  
 
== Examples ==
 
== Examples ==
=== Example #1: Basic ===
+
=== Example #1: Short Version ===
  
<code><nowiki>{{youtube | https://www.youtube.com/embed/CBttHicGbek}}</nowiki></code>
+
If you use this version you '''can not''' add a space before the ID (ie. after the "|").
{{youtube| https://www.youtube.com/embed/CBttHicGbek}}
+
  
=== Example #2: Specific Dimensions ===
+
<code><nowiki>{{youtube |CBttHicGbek}}</nowiki></code>
 +
{{youtube|CBttHicGbek}}
  
<code><nowiki>{{youtube
+
=== Example #2: Longer Version ===
| url= https://www.youtube.com/embed/CBttHicGbek
+
If you use this version you '''can not''' add a space before the ID (ie. after the "=").
| height=400
+
 
| width=400
+
<code><nowiki>{{youtube | id=CBttHicGbek }}</nowiki></code>
}}</nowiki></code>
+
{{youtube | id=CBttHicGbek }}
{{youtube
+
 
  | url= https://www.youtube.com/embed/CBttHicGbek
+
=== Example #3: Longer Version: Specific Dimensions ===
  | height=400
+
By default this template will apply a width of 400 pixels and a height of 225 pixels to the video.  This is a reasonable size to show it's thumbnail in the wiki, and the viewer can easily full-screen the video if they want.
  | width=400
+
 
 +
However, sometimes, when a video is particularly significant to the page that it's on, you may wish to display it with a different height/width, and you can do so as shown below:
 +
 
 +
If you use this version you '''can not''' add a space before the ID (ie. after the "=").
 +
 
 +
<code><nowiki>{{youtube </nowiki></code>
 +
 
 +
<code><nowiki> | id=CBttHicGbek</nowiki></code>
 +
 
 +
<code><nowiki> | height=576</nowiki></code>
 +
 
 +
<code><nowiki> | width=1024</nowiki></code>
 +
 
 +
<code><nowiki>}}</nowiki></code>
 +
{{youtube  
 +
  | id=CBttHicGbek
 +
  | height=576
 +
  | width=1024
 
}}
 
}}
</noinclude><includeonly><div class="youtube-placeholder" {{#if: {{{height}}}| data-height="{{{height}}}"}} {{#if: {{{width}}}| data-width="{{{width}}}"}} data-url="{{{url|{{{1}}}}}}">Loading Video ...</div></includeonly>
+
 
 +
</noinclude><includeonly><div class="youtube-placeholder" data-height="{{{height|225}}}" data-width="{{{width|400}}}" data-url="{{{url|https://www.youtube.com/embed/{{{1|{{{id|}}}}}}}}}">Loading Video ...</div></includeonly>

Latest revision as of 17:19, 25 October 2019

This template allows you to embed a Youtube video in a page. To use it you simply provide the ID of a Youtube video, and optionally a height and width.

Although you can use this template anywhere (that is appropriate) in the wiki, the Videos page is one great place to start.

Contents

Finding a Video's ID

Every Youtube video includes its ID in its URL. For instance, if you right click on the Green Trailer video and choose "Copy video URL", you'd get the URL:

https://youtu.be/CBttHicGbek

The ID is the part after "https://youtu.be/", in other words:

https://youtu.be/CBttHicGbek

Other Youtube URLs may put it elsewhere, but it always be present. For instance, if you visit the Youtube page for that video, it will take you to:

https://www.youtube.com/watch?v=CBttHicGbek

Examples

Example #1: Short Version

If you use this version you can not add a space before the ID (ie. after the "|").

{{youtube |CBttHicGbek}}

Loading Video ...

Example #2: Longer Version

If you use this version you can not add a space before the ID (ie. after the "=").

{{youtube | id=CBttHicGbek }}

Loading Video ...

Example #3: Longer Version: Specific Dimensions

By default this template will apply a width of 400 pixels and a height of 225 pixels to the video. This is a reasonable size to show it's thumbnail in the wiki, and the viewer can easily full-screen the video if they want.

However, sometimes, when a video is particularly significant to the page that it's on, you may wish to display it with a different height/width, and you can do so as shown below:

If you use this version you can not add a space before the ID (ie. after the "=").

{{youtube

| id=CBttHicGbek

| height=576

| width=1024

}}

Loading Video ...