[Web Tool] Google Drive外部埋込みコード作成ツール, 熊本学園大学
Google Driveの動画のアドレスを貼り付けます（動画ファイルを右クリックして「共有可能なリンクの取得」をクリックするとコピーされます。また、その際は「リンクの共有」をオンにしてください。）埋め込みコードが表示されます。
熊本学園大学
https://www.ecc.kumagaku.ac.jp/technology_information/video/upload/clip-code
PC版では埋込みコードが作れるがアプリ版で作れるのはリンクアドレスのみ。手作業でやる場合アドレス部分は以下のように変更
リンクアドレス
https://drive.google.com/file/d/abcdefghijk.......
ｖ
https://drive.google.com/file/d/abcdefghijk....../preview
hhbjkkkn pc
Googleドライブを使用してホームページへ動画を埋め込む方法
4.1 ①Googleドライブにアクセス
4.2 ②好きな場所に動画をアップロード
4.3 ③完全にアップできたら動画をクリックする
4.4 ④新しいウィンドウで開くをクリック
4.5 ⑤共有をクリック
4.6 ⑥「共有可能なリンクを取得」をクリック
4.7 ⑦詳細設定をクリック
4.8 ⑧スクロールしていき、チェックボックス2項ともチェックを入れる
5 「⑥～⑧の表示が変わりました（2020/05/10時点）」
5.1 ⑥画面右上の歯車をクリック
5.2 ⑦全てのチェックをはずします
5.3 ⑧リンクを取得の「制限付き」を「リンクを知っている全員」に変更
5.4 ⑨アイテムを埋め込むをクリック
5.5 ⑩表示されたタグをHTMLに貼り付ける
日々の気付きブログ
https://mahoroba148.com/drivemovie/
熊本学園大学
https://www.ecc.kumagaku.ac.jp/technology_information/video/upload/clip-code
YouTubeいらず！Googleドライブで動画を埋め込む方法
2019年2月5日
2020年05月10日
[このブログは2020/05/10に追記しました]
まほろば@mahoroba148です。
ホームページに動画を掲載する場合にはYouTubeを埋め込むのが主流です。私も当然のようにYouTubeにアップしていましたが、なんとGoogleドライブを利用して埋め込みができることが判明しました。
Googleドライブで動画を埋め込むと
動画の管理が楽
再生後に余分な関連動画が出ない
というようなメリットがあります。
今回はGoogleドライブを使用した動画の掲載方法をご紹介します。
■まずは動画を見てみよう
百聞は一見に如かず。まずは埋め込み動画を見てましょう。
縦横比がおかしくなっている場合は、再生すると正しい比率に戻ります。YouTubeとほとんど変わらない見た目で埋め込みできていますね。そのまま再生することはもちろん、全画面表示も可能です。
冒頭でメリットとして以下を挙げました。
動画の管理が楽
再生後に余分な関連動画が出ない
YouTubeと比較しながら詳しく解説していきます。
☆動画の管理が楽
YouTubeの場合、YouTube管理ページにアクセスして動画をアップロードします。その際、動画の説明やカテゴリなどを設定を行います。動画の説明やカテゴリなどの設定しなくてもいいのですがYouTubeという別サイトへアップする以上、信頼のある動画として情報は適切に入力するべきと私は考えます。情報の入力はただ動画の埋め込みをしたいと考えると手間です。
一方Googleドライブは、普段みなさんが使用しているGoogleドライブにアップロードするだけです。YouTubeよりも設定する項目が少ないため簡単にアップロードできます。動画専用のフォルダを作成しておけば、他のファイルと混ざることはありません。また、フォルダも複数作成できるので、カテゴリや掲載日付でまとめることも簡単です。
☆再生後に余分な関連動画が出ない
YouTubeでは再生後に関連動画は表示されます。自分の動画であれば効果的な機能です。しかし、その分離脱される可能性が高まります。ましてや全く自分とは関係のない動画が表示されてイメージを損なうこともあるかもしれません。Googleドライブは「もう一度みる」というボタンしか表示されません。
☆YouTubeに離脱するリスクを軽減できます。
■デメリットは？
検証したわけではないので、あくまで主観ではありますが
再生数がわからない
検索には弱い
サムネイルが変更できない
です。
☆再生数がわからない
動画アップロードシステムではないため、ホームページに埋め込んだ動画がどのくらい再生されたかはわかりません。もしかしたらGoogleアナリティクスなどのアクセス解析を使用すれば、計測する方法もあるかもしれません。ただ、YouTubeではすでにアクセス解析が埋め込まれているのでデメリットといえるでしょう。
☆検索に弱い
今や動画戦略と呼ばれるほど、動画も検索評価の対象になっています。YouTubeがGoogleの傘下ということもあり、検索すると動画が一番に表示されることも増えてきました。YouTubeにアップしていないということは、当然のことながら検索の対象外です。Googleドライブにチャンネル登録ボタンもないので（あったら怖いけど）YouTubeからの導入もないでしょう。
☆サムネイルの変更ができない
また、サムネイルの変更ができません。サムネイルとは動画を再生する前に表示される画像のことです。Googleドライブにアップした動画のサムネイルはランダム表示と予想されます。必ずしも動画の最初の画面ではないため、サムネイルを変更することができません。
■Googleドライブを使用してホームページへ動画を埋め込む方法
いよいよGoogleドライブを使用して動画を埋め込んでいきます。Googleドライブを使用しますので、Googleアカウントは必須です。なお、Googleドライブの仕様変更により画面表示や手順が異なる場合がございます。ご注意ください。
①Googleドライブにアクセス
アプリの表示や並びが異なる場合があります。とにかくGoogleドライブを見つけてください。
②好きな場所に動画をアップロード
「.mp4」形式が安心という記事を見かけたので、私もmp4にしました。Googleドライブ上での再生テストでは「.wmv」「.mpg」も成功しました。
※動画の埋め込みは試してません。
③完全にアップできたら動画をクリックする
テロップでアップロード完了しましたと出ていても、アップ直後は処理が行われているようです。
図の左が処理中、右が完全にアップできた状態です。
④新しいウィンドウで開くをクリック
画面右上にある3つの点をクリックして「新しいウィンドウで開く」をクリックします。
⑤共有をクリック
[2020/05/10追記]
現在時点で⑥～⑧の表示が異なります。新しい画面で手順を確認したい方は「⑥～⑧の表示が変わりました（2020/05/10時点）」まで飛ばしてください。
⑥「共有可能なリンクを取得」をクリック
おそらく埋め込み動画をダウンロードされると嫌な方が多いと思いますので⑦⑧で制限をかけます。
⑦詳細設定をクリック
⑧スクロールしていき、チェックボックス2項ともチェックを入れる
今回は閲覧権限にしているため上段は関係ないのですが、念のためチェックを入れます。設定後は必ず完了ボタンを押しましょう。
「⑥～⑧の表示が変わりました（2020/05/10時点）」
⑥画面右上の歯車をクリック
⑦全てのチェックをはずします
チェックを外したら「←」で前の画面に戻ってください。
⑧リンクを取得の「制限付き」を「リンクを知っている全員」に変更
権限は「閲覧者」になっていることを確認します。確認できたら「完了」を押してください。
⑨アイテムを埋め込むをクリック
④と同じ手順で画面右上にある3つの点をクリックして、今後はアイテムを埋め込むを選択します
⑩表示されたタグをHTMLに貼り付ける
YouTubeの埋め込みと同じようにホームページへ埋め込みましょう。
その際、スマホ対応のサイトの場合は下記の部分を消してから埋め込むと良いかもしれません。
width="640" height="480"
スマホ対応の方法は「YouTube 埋め込み レスポンシブ」などと検索すると出てきますよ WordPressの場合は必ずHTML編集やテキストモードで貼り付けましょう。
今回はGoogleドライブを利用した動画の埋め込み方法をご紹介しました。管理面、離脱リスクから見るとYouTubeよりもGoogleドライブが有利な印象です。あとは動画のアップがYouTubeよりも早いように感じました。調べた当初は特定の人に公開する方法として使えないかと思っていましたが、これに関してはどっちもどっちという感じ。YouTubeの限定公開もGoogleドライブもリンクを知られてしまったらダメです。それを言い出すと記事にパスワードをかけても同じになってしまいますね…。本当に限定的にするならば会員ログインのようなシステムを導入しなければいけません。（これもアカウント知られたら云々ってなるかな？笑）とにかく、手軽に埋め込むならばGoogleドライブで埋め込みはありですね！ぜひ試してみてください。
日々の気付きブログ
https://mahoroba148.com/drivemovie/
