Difference between revisions of "Widget:Html5media"
m (testing if statement in almost plain text) |
m (testing with javascript..) |
||
| Line 18: | Line 18: | ||
To use this widget on your site, just install [http://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy [{{fullurl:{{FULLPAGENAME}}|action=edit}} full source code] of this page to your wiki as '''{{FULLPAGENAME}}''' article. | To use this widget on your site, just install [http://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy [{{fullurl:{{FULLPAGENAME}}|action=edit}} full source code] of this page to your wiki as '''{{FULLPAGENAME}}''' article. | ||
</noinclude> | </noinclude> | ||
| − | + | <script type="application/javascript">console.log( "<!--{$url|validate:url}-->" );</script> | |
| − | + | <script src="https://api.html5media.info/1.1.4/html5media.min.js"></script><video src="<!--{$url|validate:url}-->" width="<!--{$width|default:425|validate:int|escape:'html'}-->" height="<!--{$height|default:355|validate:int|escape:'html'}-->" | |
| − | controls preload></video> | + | controls preload></video> |
| − | |||
Revision as of 16:03, 13 November 2017
This widget allows you to embed HTML5 Media on your wiki page.
Created by taipan
preparing a video
For format compatibility, go to Mozilla, or caniuse.com (MPEG-4/H.264, WebM, Ogg/Theora)
To convert a video (to progressive h264 mp4), use FFmpeg:
ffmpeg -i inputfile.avi -c:v libx264 -pix_fmt yuv420p -movflags faststart outputfile.mp4
Using this widget
For information on how to use this widget, see widget description page on MediaWikiWidgets.org.
You can use the filepath special template reference like this:
{{#Widget:Html5media|height=30|url={{filepath:voice.mp3}}}}
Copy to your site
To use this widget on your site, just install MediaWiki Widgets extension and copy full source code of this page to your wiki as Widget:Html5media article.
<script type="application/javascript">console.log( "" );</script> <script src="https://api.html5media.info/1.1.4/html5media.min.js"></script><video src="" width="" height="" controls preload></video>
