動画(ビデオ)をブログやサイトへ埋め込む方法(GoogleDrive編)

スライドショービデオを、
「GoogleDrive」にアップロードしてリンクを取得します!

動画が再生できるようになるまで、しばらく時間がかかる様でしたら、
この記事を最後まで読んでから右上の「ポップアウト」をクリックしてみて下さいませ。

1.グーグルアカウントを登録

先に登録しておくと、様々なサポートが受けられます。

登録済みの方は、目次の2.から始めてください。

グーグルアカウントとインターネット環境があると何かといい事があります。

    無料サービス
  • Googleドライブ15GBまで
  • G-メール
  • Googleフォトにバックアップ保存
  • GoogleMAP(上限あり)
  • Googleスプレッドシート(表計算)
  • Googleスライド(スライドショー)
  • Googleドキュメント(文章作成)
  • Googleサイト
  • Googleレンズ
  • etc

2.mp4ビデオを作ります。

プレゼン作成ソフトを開きます。

スライドショーの作り方は、「パワーポイントのスライドショーをブログへ埋め込む方法(OneDrive編)」を参考にして下さい。

事前に画面録画ソフトを準備します。

今回は、無料でウォーターマークが表示されないインターネット上で使用する「Apowersoft」を用いてビデオを作成します。

オンライン上で操作しますので、ソフトウェアのダウンロードは必要はありませんが、初回利用時のみ、起動用ツールのインストールが必要となります。

  1. スライドショーができたら、画面録画ソフトでビデオを作ります。

  2. 「録画開始」をクリックします。(初回のみ少し時間がかかります)

  3. バーが表示されるので、「エイリアカスタマイズ」で録画サイズを選びます。

  4. どれか選ぶと、「移動マーク」が表示されるので、プレゼンソフトを立ち上げ、ドラッグして録画範囲を決めます。
    「録画ボタンをクリックします。」

  5. カウントダウンが始まりますので、すばやくプレゼンソフトを選択しF5キーを押してスライドショーを開始します。

  6. 録画が開始されると、録画範囲の枠が赤い点線に変わります。

  7. バーの大きさなどが変わります。
    一番左が一時停止、左から2番目が「停止」です。

  8. 停止すると、録画されたビデオが別画面が開き自動再生されます。
    下のスクロールバーのつまみをドラッグして不要な部分をトリムできますが、ビデオファイルを「保存」して使い慣れた動画ソフトをお持ちの場合はそちらで編集します。


  9. 「フォルダーを開く」を選択すると

  10. ドキュメントに「Apowersoft」のフォルダーが自動で作成され、データが格納されます。

  11. 動画ソフト(ちなみにこれは無料のムービーメーカーの画面です)で、保存されたファイルを開き編集します。

  12. 編集ができたら、mp4形式で保存します。



3.グーグルドライブにビデオをアップロードします

  1. アカウントにログインした状態で、グーグルドライブを開きます。

  2. 何もないところにファイルをドラッグして、ビデオをアップロードします。



4.ファイルを共有➡リンクを取得します

アップロードできたら、ファイルをダブルクリックするなどして開きます。

  1. 右上の3点から「新しいウィンドウで開く」を選びます。

  2. 更に3点から「共有」をクリックします。

  3. 「歯車アイコン」をクリックして設定します。

  4. チェックを外し、←をクリックして戻ります。

  5. リンクを取得の「変更」をクリックします。

  6. 「リンクを知っている人」にチェックします。

  7. 「閲覧者」にチェックします。

  8. 「リンクをコピー」をクリックします。

  9. メモ帳などに貼っておきます。「完了」をクリックして閉じます。

  10. 右上の3点から「アイテムを埋め込む」をクリックします。

  11. コードをコピーしてHTMLに貼付け保存します。

  12. ブラウザで確認してみましょう!少し変ですね!



5.アスペクト比の調整をします

なぜこうなったかと言うと、ビデオは、アスペクト比16:9で作成されている。

Googleのiframeのアスペクト比4:3だからです。

width幅を調整します。

HTML100%に変更し、CSSで幅を720pxに変更して上書き保存します。


ブラウザで確認してみるといい感じになりました。


はじめからアスペクト比4:3で、ビデオを作った方がいいと思いますが、この方法を覚えておけば、どんなサイズでも調整可能です。

真ん中にある再生ボタンをクリックすると、真っ黒になるため、右上の「ポップアウト」をクリックします。


新しい画面で再生が始まりました。




6.まとめ

一番重要なポイントは、真ん中の再生ボタンをクリックすると、真っ暗な画面になるので、
右上の「ポップアウト」をクリックして下さいと、閲覧者に向けて伝える事です。

再生ボタンをクリックしたら、真っ黒になると驚く人が多いと思いますから(@_@)

  1. Googleアカウントに登録する。様々な無料サポートが受けられる。
  2. ビデオを作成する。無料でウォーターマークが表示されない画面録画ソフト「Apowersoft」おすすめです!
  3. グーグルドライブにビデオをアップロードします。
  4. ファイルを共有➡リンクを取得します。
  5. HTMLコードをコピーして、ブログやサイトへ貼り付けし保存ます。
  6. ブラウザで確認し、良ければサーバーへアップロードして完了です。

いかがでしたでしょうか?

もし、少しでもいいなー、参考になったと思っていただけたら

ぜひ、Twitter(p_fan)等で「いいね」や「シャア」していただけると嬉しいです!お辞儀している画像

See you again Take care (^.^/)))~~~bye!!




TOP