Difference between revisions of "Embedding Audio and Video"

From SCI Wiki
Jump to navigationJump to search
 
(8 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
==Embedding Audio==
 
==Embedding Audio==
  
'''OGG'''<br />
+
=== <br /> '''OGG''' ===
To be done.
+
 
 +
The following will embed an OGG file:
 +
 
 +
<div align="center"><code><nowiki>[[File:KQ4MT32DwarvesMine.ogg]]</nowiki></code></div>
 +
 
 +
The File attribute will accept extra parameters like "center" to place the player in the center of the page.
 +
 
 +
<div align="center"><code><nowiki>[[File:KQ4MT32DwarvesMine.ogg|center]]</nowiki></code></div>
 +
&nbsp;<br />
  
 
[[File:KQ4_Dwarves_Mine.ogg|center]]
 
[[File:KQ4_Dwarves_Mine.ogg|center]]
 +
<!-- [[File:KQ4MT32DwarvesMine.ogg|center]] -->
 
<div align="center">KQ4 Dwarve's Mine</div>
 
<div align="center">KQ4 Dwarve's Mine</div>
  
 
==Embedding Video==
 
==Embedding Video==
  
===OGV===
+
===<br /> mp4 ===
Theora (OGV and OGG) is a [http://www.xiph.org/ Xiph.Org's] (Vorbis audio format and the OGG container) free lossy video compression format, distributed without licensing fees. Videos can be encoded to Theora with the free [http://www.minicoder.minitech.org/download.html MiniCoder batch encoder]. The following code can be used to embed an OGV video. It uses the same code as images. The "thumbtime=" specifies what video frame to use for the thumbnail image.
+
 
<pre>[[File:SeasonedPro.ogv|thumb|thumbtime=0:02|320px|center|<div align="center">1990 Christmas Card - The Seasoned Pro (256 colors)</div>]]</pre><br />
+
For locally uploaded content the process for displaying it on a page is the same as an image.  [https://www.mediawiki.org/wiki/Help:Images#Syntax See the image syntax documentation] on MediaWiki.org for complete reference on this feature.
 +
 
 +
This example would display a video in page using a HTML5 <code><nowiki><video></nowiki></code> tag.
 +
 
 +
<div align="center"><code><nowiki>[[File:Example.mp4]]</nowiki></code></div>
 +
 
 +
To specify the start and end timestamps in the media use the start and end parameters. The timestamp can be formatted as one of: ss, :ss, mm:ss, hh:mm:ss, or dd:hh:mm:ss.
 +
 
 +
<div align="center"><code><nowiki>[[File:Example.mp4|start=2|end=6]]</nowiki></code></div>
 +
 
 +
<div align="center"><code>[[File:SeasonedPro.mp4|center]]</code></div>
 +
 
 +
[[File:SeasonedPro.mp4|center]]
 +
<div align="center">''[[Christmas Card 1990 - The Seasoned Professional (VGA)|1990 Christmas Card - The Seasoned Pro (256 colors)]]''</div>
 +
<!--
 +
<pre>[[File:SeasonedPro.mp4|thumb|thumbtime=0:02|320px|center|<div align="center">1990 Christmas Card - The Seasoned Pro (256 colors)</div>]]</pre><br /> -->
 +
<!-- <div align="center"><div style="border-bottom:1px solid #fad67d; padding:0.4em 1em 0.3em; width:640px"></div></div> -->
 +
<!-- <br />
 +
{{Motd|width=640|float=center}} -->
 +
<!-- "http://sierrahelp.com/Assets/Movies/Camelot.flv" -->
 +
 
 +
===<br /> YouTube ===
  
<div align="center"><div style="border-bottom:1px solid #fad67d; padding:0.4em 1em 0.3em; width:640px">
+
<div align="center"><code><nowiki>{{#evt: service=youtube|id=https://www.youtube.com/watch?v=DXnp5KSK9JM}}</nowiki></code></div>
[[File:SeasonedPro.ogv|thumb|thumbtime=1:00|640px|center|<div align="center">1990 Christmas Card - The Seasoned Pro (256 colors)</div>]]<br />
 
{{motd|width=640|float=center}}</div></div>
 
  
&nbsp;
+
will yield:
  
<!-- |left -->
+
<div align="center">{{#evt: service=youtube|id=https://www.youtube.com/watch?v=DXnp5KSK9JM|alignment=center}}</div>
 +
<div align="center">''[[The Colonel's Bequest]]'' out side of mansion</div>
  
===Flash===
 
  
<!--[[Image:Camelot.flv]]-->
+
and
 +
<div align="center"><code><nowiki><youtube>https://www.youtube.com/watch?v=8a6OP9JWNxk</youtube></nowiki></code></div>
  
 +
will yield:
  
The following code can be used to embed a Flash video.
+
<div align="center"><youtube>https://www.youtube.com/watch?v=8a6OP9JWNxk</youtube></div>
<pre><oflash file="http://sierrahelp.com/Assets/Movies/Camelot.flv" width="640" height="480" /></pre>will give:
+
<div align="center">''[[Space Quest II]]'' "Where am I?"</div>
<div align="center">
 
  
<oflash file="http://sierrahelp.com/Assets/Movies/Camelot.flv" width="640" height="480" />
+
==<br /> Also See ==
  
</div>
+
* [[Help:Contents|MediaWiki Formatting]]
<!-- caption="Conquests of Camelot Introduction" thumb="true"  -->
 
  
&nbsp;
+
[[Category:Wiki Help]]

Latest revision as of 22:01, 16 March 2019

Embedding Audio


OGG

The following will embed an OGG file:

[[File:KQ4MT32DwarvesMine.ogg]]

The File attribute will accept extra parameters like "center" to place the player in the center of the page.

[[File:KQ4MT32DwarvesMine.ogg|center]]

 

File:KQ4 Dwarves Mine.ogg

KQ4 Dwarve's Mine

Embedding Video


mp4

For locally uploaded content the process for displaying it on a page is the same as an image. See the image syntax documentation on MediaWiki.org for complete reference on this feature.

This example would display a video in page using a HTML5 <video> tag.

[[File:Example.mp4]]

To specify the start and end timestamps in the media use the start and end parameters. The timestamp can be formatted as one of: ss, :ss, mm:ss, hh:mm:ss, or dd:hh:mm:ss.

[[File:Example.mp4|start=2|end=6]]

File:SeasonedPro.mp4


YouTube

{{#evt: service=youtube|id=https://www.youtube.com/watch?v=DXnp5KSK9JM}}

will yield:

The Colonel's Bequest out side of mansion


and

<youtube>https://www.youtube.com/watch?v=8a6OP9JWNxk</youtube>

will yield:

Space Quest II "Where am I?"


Also See