Extension:EmbedVideo
現在、この拡張機能は積極的な保守が行われていません! それでも機能する可能性はありますが、バグ報告や機能の要望は無視される可能性が高くなります。 |
EmbedVideo リリースの状態: 保守されていない |
|
---|---|
実装 | パーサー関数 |
説明 | 一般的な動画共有サービスのビデオクリップを埋め込むための#ev というパーサー関数を追加する |
作者 |
|
最新バージョン | 3.4.0 (2020-10-14) |
MediaWiki | 1.29+ |
PHP | 7.0+ |
Composer | starcitizenwiki/embedvideo |
ライセンス | MIT ライセンス |
ダウンロード | GitLab: |
例 | Gamepedia Help Wiki |
|
|
使用中の公開ウィキ | 7,623 (Ranked 21st) |
EmbedVideo 拡張機能の翻訳にご協力ください | |
Vagrant role | embedvideo |
EmbedVideo拡張機能では、24以上の人気動画共有サービスの動画クリップを多言語・多国で埋め込むためのパーサー機能#ev
を追加しています。
また、ビデオとオーディオのメディアハンドラを追加し、標準の[[File:Example.mp4]]ファイルリンクを埋め込み型のHTML5 <video>
および<audio>
タグに変換することをサポートします。
- プロジェクトのホームページ
- GitLab の説明文書
- ソース コード
- GitLab のソースコード
- バグ
- GitLabの課題
- ライセンス条件
- EmbedVideoは、The MIT Licenseの下でリリースされています。
使用法
メディアハンドラ
ローカルにアップロードされたコンテンツの場合、ページへの表示方法は画像と同じです。 この機能に関する完全なリファレンスは、画像構文のドキュメントを参照してください。
この例では、HTML5の<video>
タグを使って、ページ内に動画を表示します。
[[File:Example.mp4]]
メディア内の開始と終了のタイムスタンプを指定するには、startとendパラメータを使用します。 タイムスタンプの形式は、ss, :ss, mm:ss, hh:mm:ss, or dd:hh:mm:ssのいずれかとすることが可能です。
[[File:Example.mp4|start=2|end=6]]
タグ
EmbedVideo パーサー関数は、以下のいずれかの方法で呼び出されることを想定しています。
<span id="#ev
_—_Classic_parser_tag">
#ev
— 古典的なパーサタグ
{{#ev:service|id}}
{{#ev:service|id|dimensions}}
{{#ev:service|id|dimensions|alignment}}
{{#ev:service|id|dimensions|alignment|description}}
{{#ev:service|id|dimensions|alignment|description|container}}
{{#ev:service|id|dimensions|alignment|description|container|urlargs}}
{{#ev:service|id|dimensions|alignment|description|container|urlargs|autoresize}}
{{#ev:service|id|dimensions|alignment|description|container|urlargs|autoresize|valignment}}
ただし、必要であれば、パイプの間に何も入れず、オプションの引数を空白にすることもできる。
{{#ev:service|id|||description}}
<span id="#evt
_—_Parser_tag_for_templates">
#evt
— テンプレート用パーサータグ
#evt
パーサーのタグは、key=valueのペアを使用できるため、テンプレート化しやすく、可読性も高くなります。
{{#evt: service=youtube |id=https://www.youtube.com/watch?v=eAORm-8b1Eg |alignment=right }}
<span id="#evu
_—_Parser_tag_for_URLs">
#evu
— URL用パーサータグ
#evu
パーサータグは#evt
タグと似ていますが、その最初のパラメータは、サービスを自動的に決定するために解析されるURLです。
{{#evu:https://www.youtube.com/watch?v=eAORm-8b1Eg |alignment=right }}
<span id="<embedvideo>
_—_Tag_hook">
<embedvideo>
— タグフック
<embedvideo>...</embedvideo>
のタグフックを使えば、簡単に動画を埋め込むことができます。
ID/URLはタグの間に入力され、パラメータはタグの引数として追加することができます。
<embedvideo service="youtube">https://www.youtube.com/watch?v=eAORm-8b1Eg</embedvideo>
また、サービスIDをタグとして使用することもできます(他の拡張機能がまだこのタグを使用していないことが前提です)。
<youtube>https://www.youtube.com/watch?v=eAORm-8b1Eg</youtube>
パーサタグの属性
属性 | 説明 | 必須かどうか | 既定値 |
---|---|---|---|
service="(後述の「サポートサービス」を参照。)"
|
呼び出すビデオサービスです。 | 必須 | |
id="[id|url]"
|
プレーヤーページからの動画またはURLの生のID。 | 必須 | |
dimensions="[WIDTH|WIDTHxHEIGHT|xHEIGHT]"
|
埋め込みコンテナの大きさを表すピクセル単位の寸法。 標準的な形式は幅x 縦(高さ)で、どちらかを省略することもできるが、x は高さを表示するために必要になります。
例: Gfycatなど一部のサービスでは標準的な高さがないため、埋め込みごとに指定する必要があります。
|
省略可能 | 640
|
alignment="[left|center|right|inline]"
|
映像の配置を左寄せ、中央寄せ、右寄せのいずれかにします。 インラインでは、複数のビデオを強制的に改行することなく並べて表示することができます。 | 省略可能 | なし |
description="[wikitext]"
|
埋め込みコンテナの下に説明文を表示する。 改行には (https://www.w3.org/TR/REC-xml/#AVNormalize参照)を使用します。
|
省略可能 | なし |
container="[frame]"
|
埋め込みに使用するコンテナの種類を指定する。
|
省略可能 | なし |
urlargs="modestbranding=1&version=3"
|
生成された埋め込みURLに、追加のURL引数を付加できるようにする。 これは、あるサービスにしか対応していない不明瞭なオプションに有効です。 | 省略可能 | なし |
autoresize="false"
|
動画のサイズがコンテナ要素の外側で壊れてしまう場合、自動的にリサイズされます。 | 省略可能 | true
|
valignment="[top|middle|bottom|baseline]"
|
動画の垂直方向の配置を、親要素の上、中央、下、ベースラインのいずれかに揃える。 このパラメータを使用すると、alignmentパラメータがインラインになるように強制されます。 | 省略可能 | なし |
例
例えば、YouTubeの動画は、youtube
のサービスセレクタを使用します。
IDだけのいづれかを指定することができます。
{{#ev:youtube|eAORm-8b1Eg}}
または完全なURLを指定する。
{{#ev:youtube|https://www.youtube.com/watch?v=eAORm-8b1Eg}}
同じ動画を右寄せの大きなサムネイルで、説明文付きで表示する場合。
{{#ev:youtube|https://www.youtube.com/watch?v=eAORm-8b1Eg|1000|right|Let eet GO|frame}}
YouTubeで動画を特定の時間に開始させる場合は、urlargs
(URL引数)パラメータを利用します。
カスタムURLから残りのURL引数を取り出して、urlargs
に入れます。
すべての動画サービスが追加のURL引数をサポートしているわけではなく、またURL引数のキーが異なる場合がありますので、ご注意ください。
https://www.youtube.com/watch?v=eAORm-8b1Eg&start=76
{{#ev:youtube|https://www.youtube.com/watch?v=pSsYTj9kCHE|||||start=76}}
URL引数で動画を切り刻み、ループさせることができる。
https://www.youtube.com/watch?v=eAORm-8b1Eg&start=160&end=180&loop=1
{{#ev:youtube|https://www.youtube.com/watch?v=eAORm-8b1Eg|||||start=160&end=180&loop=1}}
ビデオリンクタグのサポート
バージョン2.5から、未整備のVideoLink拡張のタグに対応しました。
オリジナルの拡張機能のドキュメントより。
VideoLink拡張機能は、記事中にYouTube動画を埋め込むことができ、ユーザーが動画リンクをクリックしたときに最初に表示される埋め込み動画プレーヤーで、リンク先の複数の動画を再生することが可能です。
<vplayer />
はページ内のプレーヤーを表示する場所を指定し、2のパーサー関数で特定のビデオを読み込むリンクを作成できます。
<span id="<evlplayer>
_—_Tag_hook_for_video_container">
<evlplayer>
— ビデオコンテナ用タグフック
<vplayer>
タグの使用も許容される。この<evlplayer>
タグは、ビデオプレーヤーコンテナをページ内に配置するために使用されます。
<evlplayer id="player id" w="width" h="height" class="class" style="style">既定のコンテンツ</evlplayer>
また、既定のコンテンツの代わりに、既定でコンテナを埋める動画を設定することも可能です。
<evlplayer id="player1" w="480" h="360" service="youtube" defaultid="eAORm-8b1Eg" />
属性 | 必須かどうか | 既定値 | 説明 |
---|---|---|---|
id
|
省略可能 | default | このコンテナに対するオプションの一意な識別子。 |
w
|
省略可能 | 800 | 埋め込みプレーヤーが生成される際に送信される幅。 |
h
|
省略可能 | 幅から16:9を実現する | 埋め込みプレーヤーが生成されたときに送信する高さ。 |
class
|
省略可能 | コンテナ<div> に追加するCSSクラス。
| |
style
|
省略可能 | コンテナ<div> に適用する追加のインラインCSS。
| |
defaultid
|
省略可能 | Video ID of default video, if you want a default video. | |
service
|
省略可能 | 既定の動画が必要な場合は、既定の動画のサービス。 |
注意すべき重要な点は、w
とh
の属性は、コンテナ<div>
に含まれるビデオにのみ影響し、実際のコンテナには影響しないことです。
コンテナのスタイリングには、class
またはstyle
の属性を使用してください。
<span id="#evl
_—_Parser_function_for_video_links">
#evl
— 動画リンク用パーサー機能
{{#vlink}}
パーサー関数の使用も許容される。{{#evl:<動画 ID>|<リンク テキスト>|<再生する動画>|service=youtube|player=<プレイヤー ID>}}
#evt
タグでサポートされているすべての属性に加え、これらの特定の属性が#evl
(および#vlink
)タグに適用されます。
後方互換性を維持するため、service
を定義しない場合はyoutube
と見なされます。
属性 | 必須かどうか | 既定値 | 説明 |
---|---|---|---|
動画 ID | 必須 | なし | 再生したいビデオのID、または再生するビデオのカンマ区切りリスト。 セミコロンで区切られた複数のビデオIDの使用は、現在では推奨されていませんのでご注意ください。 |
リンク テキスト | 必須 | なし | リンクの内側に表示するテキスト。 |
再生する動画 | 省略可能 | なし | ビデオIDがカンマ区切りの場合、ビデオIDから再生するビデオを示す番号。 |
動画 ID | 省略可能 | default
|
動画を読み込むプレーヤコンテナ。 IDdefault は、IDのないプレーヤーを定義した場合のみ存在することに注意してください。
|
最初のビデオ | 廃止予定 | オリジナルのビデオリンクでは、複数のビデオが定義されている場合、どのビデオを最初に再生するかを定義していました。 ビデオIDおよびスタートでの注意事項をご覧ください。 | |
開始 | 廃止予定 | 0:00 | オリジナルのビデオリンクでは、これは動画の開始時刻を定義していました。 複数の動画サービスに対応しているため、urlargs >パラメータでこの機能を再現できるようになりました。 後方互換性のために、この属性は、サービスyoutube を持つビデオに尊重される。
|
動画リンク例
ビデオリストの作成は、ビデオリンクがyoutube、youtubevideolistのサービスを利用して、その場でプレイリストを作成することができます。
<evlplayer w="width" h="height" class="class" style="style" id="example-player">既定のコンテンツ</evlplayer>
{{#evl:21X5lGlDOfg|NASA Live|1|player=example-player}}
{{#evl:lEyCq2KRZik|IIS Q&A|2|player=example-player}}
{{#evl:OLeWbRdW6rY|Space Station Tour|3|player=example-player}}
サポートされるサービス
バージョン2.x以降、EmbedVideoは以下のサービスからのビデオコンテンツの埋め込みに対応しています。
サイト | サービス名(複数可) | IDの例 | URLの例(複数可) | 備考 |
---|---|---|---|---|
Archive.org 動画 | archiveorg
|
electricsheep-flock-244-80000-6 | https://archive.org/embed/electricsheep-flock-244-80000-6 | |
Bambuser | bambuser
|
5262334 | http://bambuser.com/v/5262334 | 放送 |
bambuser_channel
|
チャンネル | |||
Beam | beam
|
RocketBear | https://beam.pro/RocketBear | ストリーム |
Bing | bing
|
31ncp9r7l | http://www.bing.com/videos/watch/video/adorable-cats-attempt-to-eat-invisible-tuna/31ncp9r7l | |
Blip.tv | blip
|
http://blip.tv/vinylrewind/review-6864612 | Blipは動画ページの完全なURLを必要とし、IDだけは受け付けません。 | |
C3TV | mediacccde
|
32c3-7305-quantum_cryptography | https://media.ccc.de/v/32c3-7305-quantum_cryptography | |
CollegeHumor | collegehumor
|
6875289 | http://www.collegehumor.com/video/6875289/batman-says-his-goodbyes | |
Dailymotion | dailymotion
|
x1adiiw_archer-waking-up-as-h-jon-benjamin_shortfilms | http://www.dailymotion.com/video/x1adiiw_archer-waking-up-as-h-jon-benjamin_shortfilms | |
Daum TVPot | tvpot — シェアメニューのURLからURLまたはIDを取得する。
|
s9011HdLzYwpLwBodQzCHRB | http://tvpot.daum.net/v/s9011HdLzYwpLwBodQzCHRB | |
Div Share | divshare
|
|||
Edutopia | EdutopiaのコンテンツはYouTubeに移行しました。 下記のYouTubeサービスセレクターをご利用ください。 | |||
FunnyOrDie | funnyordie
|
c61fb67ac9 | http://www.funnyordie.com/videos/c61fb67ac9/to-catch-a-predator-elastic-heart-edition | |
Gfycat | gfycat
|
BruisedSilentAntarcticfurseal | http://www.gfycat.com/BruisedSilentAntarcticfurseal | |
Hitbox | hitbox
|
Washuu | http://www.hitbox.tv/Washuu | |
JW Player | jwplayer
|
cr5d8nbu-8ZpoNmmJ | https://content.jwplatform.com/players/cr5d8nbu-8ZpoNmmJ.html | |
Kickstarter | kickstarter
|
elanlee/exploding-kittens | https://www.kickstarter.com/projects/elanlee/exploding-kittens | |
Metacafe | metacafe
|
11404579 | http://www.metacafe.com/watch/11404579/lan_party_far_cry_4/ | |
Nico Nico Video | nico
|
sm24394325 | http://www.nicovideo.jp/watch/sm24394325 | |
RuTube | rutube
|
b698163ccb67498db74d50cb0f22e556 | http://rutube.ru/video/b698163ccb67498db74d50cb0f22e556/ | |
SoundCloud | soundcloud
|
https://soundcloud.com/skrillex/skrillex-rick-ross-purple-lamborghini | SoundCloudは完全なURLを必要とします。 | |
TeacherTube | teachertube
|
370511 | http://www.teachertube.com/video/thats-a-noun-sing-along-hd-version-370511 | |
TED Talks | ted
|
bruce_aylward_humanity_vs_ebola_the_winning_strategies_in_a_terrifying_war | http://www.ted.com/talks/bruce_aylward_humanity_vs_ebola_the_winning_strategies_in_a_terrifying_war | |
Tubi TV | tubitv
|
318409 | http://tubitv.com/video/318409 | |
Tudou | tudou
|
mfQXfumwiew | http://www.tudou.com/listplay/mfQXfumwiew.html | |
Twitch | twitch
|
twitchplayspokemon | http://www.twitch.tv/twitchplayspokemon | ライブ配信 |
twitchvod
|
アーカイブスビデオオンデマンド | |||
Videomaten | videomaten
|
|||
Vimeo | vimeo
|
105035718 | http://vimeo.com/105035718 | |
Vine | vine
|
h2B7WMtuX2t | https://vine.co/v/h2B7WMtuX2t | |
Yahoo Screen (Archived 2013-09-20 at the Wayback Machine) | yahoo
|
katy-perry-dances-sharks-2015-024409668 | https://screen.yahoo.com/videos-for-you/katy-perry-dances-sharks-2015-024409668.html | |
YouTube | youtube
|
pSsYTj9kCHE | https://www.youtube.com/watch?v=pSsYTj9kCHE | シングル動画 |
youtubeplaylist
|
https://www.youtube.com/watch?v=CW_PbErQ_c8&list=PL76E80C7F756A2047 | プレイリスト | ||
youtubevideolist
|
https://www.youtube.com/watch?v=CW_PbErQ_c8&playlist=CW_PbErQ_c8,CW_PbErQ_c8 | 動画リスト | ||
Youku | youku
|
XODc3NDgzMTY4 | http://v.youku.com/v_show/id_XODc3NDgzMTY4.html |
インストール
- ダウンロードして、ファイルを
extensions/
フォルダー内のEmbedVideo
という名前のディレクトリ内に配置します。 - 以下のコードを LocalSettings.php ファイルの末尾に追加します:
wfLoadExtension( 'EmbedVideo' );
- 必要に応じて設定します
- 完了 – ウィキの「Special:Version」に移動して、拡張機能が正しくインストールされたことを確認します。
設定
変数 | 既定値 | 種類 | 説明 |
---|---|---|---|
$wgEmbedVideoAddFileExtensions
|
true
|
真偽値 | アップロード可能なファイルのリストに、ビデオ/オーディオファイルの拡張子を追加することを有効または無効にします。 |
$wgEmbedVideoEnableVideoHandler
|
true
|
真偽値 | 記事に埋め込まれたビデオを表示するためのビデオメディアハンドラを有効または無効にします。 |
$wgEmbedVideoEnableAudioHandler
|
true
|
真偽値 | 記事に埋め込まれた音声を表示するための音声メディアハンドラの有効・無効を設定します。 |
$wgEmbedVideoDefaultWidth
|
''
|
整数 | 動画プレーヤーの既定の幅をグローバルにオーバーライドします。 設定しない場合、ビデオサービスの既定の幅(通常640ピクセル)が使用されます。 |
$wgEmbedVideoMinWidth
|
''
|
整数 | ビデオプレーヤーの最小幅。 この値以下で指定された幅は、自動的にこの値にバインドされる。 |
$wgEmbedVideoMaxWidth
|
''
|
整数 | ビデオプレーヤーの最大幅。 この値以上に指定された幅は、自動的にこの値にバインドされる。 |
$wgFFmpegLocation
|
'/usr/bin/ffmpeg'
|
文字列 | ffmpeg バイナリの位置を設定する。
|
$wgFFprobeLocation
|
'/usr/bin/ffprobe'
|
文字列 | ffprobe バイナリの位置を設定する。
|
バージョン履歴
- v2.9.0
- Fix stored XSS in AudioTransformOutput and VideoTransformOutput.
- Fix autoResize on mobile.
- Fix video caption escaping the container.
- Handle multiple video sizes per page in resize.
- Move beam service to mixer.
- Add a default link title for #evl/#vlink.
- Add spotify playlist embeds.
- Add facebook video embeds.
- Fix centering of videos.
- Add Microsoft Stream service.
- Add title to iframes.
- Add API help messages for 1.33 compatibility.
- Fix static analysis issues.
- Fix Twitch embeds.
- v2.8.0
- Renamed hitbox.tv to smashcast.tv.
- Updated Nico Video embed code.
- Added support for Twitch clips.
- Fix issues with Twitch VODs.
- Removed unused $wgFFmpegLocation that was interferring with TimedMediaHandler.
- Added Polish translation.
- v2.7.4
- Added support for playlist to evlplayer
- Added support for youtube video list
- Updated Documentation for evlplayer
- Added missing dependency for evlplayer in extension.json
- v2.7.3
- Default Twitch VOD to autoplay=false by default
- Allow videos to be sized in 1:1 aspect ratios for special use cases.
- v2.7.2
- Added feature to evlplayer to allow default video content
- v2.7.1
- Fixed issue with youku videos not embedding properly on https enabled wikis.
- v2.7.0
- Added SoundCloud support
- Added ability to use service name as a parser tag (if not defined previously)
- v2.6.1
- Added new configuration options to disable adding media handlers and file extensions.
- Fixed an uninitialized array.
- Fixed undefined indexes in the AudioHandler class.
- Fixed class properties that were unintentionally declared as static.
- Fixed RTL language issues with CSS.
開発者向け注記
ビデオクリップのインジェクション機構として(拡張タグではなく)パーサ関数を使用する主な利点は、パーサ関数が({{{1}}}
形式の)テンプレートパラメータを利用できることです。
例えば、YouTubeの動画をサムネイルサイズで、画像のように右寄せでたくさん作っていることに気づいたとします。 Template:Youtube_tn
というテンプレートを作って、これを入れることができるかもしれません。
<div class="thumb tright">
{{#ev:youtube|{{{1}}}|{{{2|100}}}}}
</div>
そして、このように呼び出すのです。
{{youtube tn|someYoutubeId}}
バグ報告
GitLabプロジェクトページにイシュー・トラッカーが設置されています。
貢献する
バグレポート、機能リクエスト、パッチはいつでも歓迎します。 十分な関心があれば、GitLabプロジェクトに新しい貢献者を追加することができます。
関連項目
- Extension:EmbedVideo (fork): EmbedVideoのフォーク — この拡張機能の、よりプライバシーを重視したバージョンです。 なお、a subsetのサービスのみ対応していますが、新しいサービスはGitHubからリクエストすることが可能です。
外部リンク
脚注
この拡張機能は以下のウィキ ファーム/ウィキ ホスト/パッケージに含まれています: これは正式な一覧ではありません。 一部のウィキ ファーム/ウィキ ホスト/パッケージは、ここに記載されていなくてもこの拡張機能を含んでいる場合があります。 必ずご利用のウィキ ファーム、ウィキ ホスト、バンドルで確認してください。 |