動画を挿入

[Discourse]

	Summary	Insert Video adds a composer button that simplifies adding videos with subtitles (VTT format), a poster image and multiple video sources to a Discourse post.
	Preview	Preview on Discourse Theme Creator
	Repository Link	https://github.com/discourse/discourse-insert-video
	New to Discourse Themes?	Beginner’s guide to using Discourse Themes

Install this theme component

As this is an official theme component maintained by the Discourse team, support, bug, ux, and feature requests can be made in the respective categories here on Meta, and tagged with the appropriate theme component tag. Click on a link below to get one started.

 Support  Bug  UX  Feature

Features

Clicking the button triggers a modal window that allows uploading/linking the relevant files and then adds the appropriate HTML code in the composer:

Settings

Name	Description
default track label
default track langcode
only available to staff
disable download
text tracks as blobs	When using subtitles, download VTT files and inject as blob (fixes issues when using S3 storage or a CDN)

(For uploads to work, you’ll need to allow .vtt and your chosen video formats in the authorized extensions site setting.)

Translation	Default
modal.title	Insert Video
modal.video_title	Add video sources
modal.poster	Poster image (optional)
modal.vtt_title	Subtitles (optional)
modal.vtt_help	Comma-delimited, in the format: url,label,langcode
modal.insert	Insert
modal.cancel	Cancel
source_not_video	Error: One of the video source URLs is invalid.
composer_title	Insert Video
simple_list_placeholder	Add item…

Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-13T07:09:42Z

Check document

Perform check on document:

[tomtjes (Thomas Reintjes)]

Sweet, thank you! Would it be possible to allow audio as well and just keep showing the poster image (or if none is available maybe a configurable background color) plus subtitles?

Also, and I realize this is a much bigger ask, would something like what the YouTube Timestamps Component does be doable with this component in the long-term? That’d be absolutely fantastic.

[Moin]

これはどのファイルの種類で機能することが期待されていますか？

動画を挿入する前に2つの追加の改行を追加したところ、MP4ファイルで機能しました。しかし、今のところMOVファイルではうまくいっていません。また、ここで見つけたものも機能しないようです。例：

@Discourse

以下は、Composer内のAI Helper機能の例です。注：すでにコンテンツが記述されていました。

<video controls  preload="metadata" poster="https://d11a6trkgmumsb.cloudfront.net/original/4X/e/3/4/e34904f6eedd062b77f5fe8e79b7217e975f7b71.jpeg">
  <source src="https://d11a6trkgmumsb.cloudfront.net/original/4X/0/b/a/0ba9f528c91a643df9127448496965ee9c096890.mov" type="video/mov" />
</video>

以下は、トピックを読みながらAI Helperの「説明」機能を使用する例です。

<video controls  preload="metadata" poster="https://d11a6trkgmumsb.cloudfront.net/original/4X/d/6/c/d6c3411b7c8c0d3da5ec66805fbef1d62caccc13.jpeg">
  <source src="https://d11a6trkgmumsb.cloudfront.net/original/4X/d/8/6/d86ea65cec25e0a79d2c9f0426f03e8d8f8b5385.mov" type="video/mov" />
</video>

---

気にする必要はありません。回答を見つけました：

.mov is not working

From my tests: webm – works fine ogg – can work, but by default, you can’t select it because the mime type is not referenced here ; however, as workaround you can choose “all files” in the windows, and select your .ogg file, It will work. You should not be able to validate any files (even if restricted by authorized extensions setting) . mov – doesn’t work as it is, but it can if you remove manually type="video/mov" or use type="video/mp4" instead. This should be handled in th…

[Truest]

設定にビデオアイコンを変更するボタンがあるか、または別のビデオアイコンがあると良いのですが。Jitsiプラグインのアイコンと同じなので、違いがわかりにくいです。

[putty (Derek Putnam)]

動画ファイルはURL経由でも可能ですか、それともアップロードされたファイルである必要がありますか？使用したい動画は2.3GB（60分動画）です。最大ファイルサイズを増やそうとしましたが、これほど大きいものには対応できないようです。

[Carlos_Leiva]

Bunny Stream | A better way to deliver online video | bunny.net のような専門プラットフォームとこのテーマコンポーネントを統合できると素晴らしいでしょう。

これにより、データが自分のものになったことを確認でき、ビデオストレージは Discourse やサーバーの機能に依存せず、使用した分だけ支払うことができます。理想的には、Discourse で API 設定をカスタマイズし、テーマコンポーネントを有効にするだけで、ビデオをアップロードすると自動的に bunny.net stream にアップロードされ、手間をかけずに Discourse の投稿に正しく埋め込まれます。

[putty (Derek Putnam)]

DiscourseVideoというソリューションを見つけ、Muxに直接アップロードできるようにしました。

[efuetatem1 (Efuet A Andrew)]

@putty

finding a solution (DiscourseVideo)

@puttyさん、そのDiscourseVideoはプラグインですか？ここで検索しましたが、見つかりませんでした。ありがとうございます。

[NateDhaliwal]

これがおそらくそのリポジトリでしょう。ガイドはそこにあります。

GitHub - discourse/discourse-video

[efuetatem1 (Efuet A Andrew)]

@NateDhaliwalさん、ありがとうございます。実際にユーザーエクスペリエンスを確認するために、このDiscourseVideoプラグインを使用しているDiscourseコミュニティを取得しようとしています。@puttyさん、もしあなたがそれを使用しているなら、あなたのコミュニティのURLを教えていただけると嬉しいです。そうすれば、自分で確認できます。

ありがとうございます。

[putty (Derek Putnam)]

@NateDhaliwal が提供したリポジトリを使用していますが、コンテンツ管理者にのみ表示されます。彼らは、私たちのコミュニティで標準ファイルサイズに達した唯一のユーザーです。

[唐帅华 (tang shuaihua)]

動画をアップロードする際に、「申し訳ありませんが、アップロードしようとしたファイルは許可されていません（許可されている拡張子：jpg、jpeg、png、gif、heic、heif、webp、avif）。」というエラーメッセージが表示されました。これはどういうことでしょうか？ウェブサイトでアップロードするファイル拡張子の範囲を変更する必要があるということですか？

[putty (Derek Putnam)]

アップロードしているファイルのタイプは何ですか？設定でその形式をホワイトリストに登録する必要があるかもしれません。

[唐帅华 (tang shuaihua)]

.vttファイルと動画形式を追加し、動画を正常に挿入できるようになりました。ご協力ありがとうございました

[putty (Derek Putnam)]

承認済みグループに、Y/Nスタッフのみの権限を更新するフォークを作成しました。

GitHub - dereklputnam/discourse-insert-video

私の場合は、マーケティングチームがサムネイルを指定できるようにしたかったのですが、スタッフ権限を付与するつもりはなく、コミュニティ全体にアクセスさせるつもりもありませんでした。