基礎編

2-07.Youtube等の活用

ここではYoutube等の外部動画を学習ページで表示する方法について御説明します。

ここではYoutube等の外部動画を学習ページで表示する方法について御説明します。

公開タグ(iframeタグ)が取得できる外部サービスであれば、Youtube以外の動画も埋め込むことができます。 (当記事では、Youtubeを使って御説明しています。)

1. チャプター作成

左メニューの「eラーニング」から「コース管理」をクリックします。

2. 「+」をクリック

レッスンの右にある「+」をクリックします。

3. チャプターの形態設定

チャプター名を入力し、チャプター形態を「動画・音声・スライド・iframe」に設定し、「登録」をクリックします。

4. コンテンツ作成画面

作成したチャプターのチャプター名をクリックします。

5. コンテンツの新規登録

「新規登録」をクリックします。

6. コンテンツの設定

コンテンツのタイトルを入力します。

形態を「iframe(youtubeなど)」に指定します。

この画面を開いたまま、YouTubeの画面に移動します。

別タブで開くか、または別ウィンドウで開くなどの開き方でYouTubeなどのウェブサイトを開きます。

※edulioの画面でそのままYouTubeなどにアクセスしてしまうと、ここまで設定した保存されていない内容が破棄されてしまいますので注意してください。

7. 共有タグ(iframeタグ)のコピー

ここではYouTubeを例にご説明します。YouTubeなどのウェブサイトで、活用したい動画のページを開きます。

8. 共有

動画の下にある「共有」をクリックします。

9. 埋め込みタグ

共有メニューの中の「埋め込む」をクリックします。

10. 埋め込みタグのコピー

赤枠で囲んだ文字列(<iframe>タグで囲まれた内容)を全てコピーします。

右下の「コピー」をクリックすると簡単にコピーできます。

※SSL(https:)ではないサービスのiframeタグは、推奨されていません。ブラウザによっては表示がされないため御注意ください。

◆共有タグの表示箇所や表示方法が変更されていることがございますが、サポート対象外です。各自でお調べください。

◆iframeタグが発行されていれば、YouTube以外の動画も埋め込める可能性がございます。

edulioの管理画面に戻ります。

先ほどの文字列をコピーしたら、別タブ、または別ウィンドウで開いてあるedulioの管理画面に戻ります。

11. 共有タグ(iframeタグ)のペースト

​「埋め込み」にコピーした文字列(共有タグ)をペーストします。

先にコピーした文字列(<iframe>タグで囲まれた共有タグ)を「埋め込み」の入力欄に貼り付け(ペースト)します。

12. 登録

ここまでの設定が全て済んだら「登録」をクリックします。

13. プレビュー確認

登録が完了しチャプター設定の画面に戻ったら「プレビュー」をクリックします。

14. 再生確認

プレビューの画面で問題なくYouTubeなどの動画が再生されたら完了です。