Tips：動画の埋め込み
・YouTube動画の埋め込み

YouTube動画の埋め込み

メモ

  • 埋め込み方法 (2019/11末 現在)
    1. YouTube で埋め込みたい動画を表示
    2. 動画の右下の[共有]をクリック
    3. [共有]ダイアログ - [埋め込み]をクリック
    4. [動画の埋め込み]ダイアログ - [コピー]リンクをクリック (利用規約についてはリンク先を参照)
      下記の指定が可能
      • 開始位置
      • プレーヤーのコントロールバーの表示有無
      • プライバシー強化モードの有効/無効
    5. クリップボードにコピーされたコードを埋め込みたい位置に張り付け
    6. 動画の埋め込みオプションの指定 (クエリパラメータに追加)
      • プライバシー強化モードの有効化：URL のドメインを https://www.youtube-nocookie.com に変更
      • 自動再生：autoplay=1
      • 指定位置：start=～ (秒単位)
      • 字幕の追加：cc_load_policy=1
        字幕言語：cc_lang_pref=～ (日本語：ja)
  • 特記事項 (2019/11末 現在)
    • 動画の埋め込みが許可されていること
    • 自動再生は、視聴回数カウントの対象外
    • 埋め込み動画の広告収益は、YouTube と 動画所有者で分配 (埋め込んだサイトの所有者は、無関係)
  • 参照

埋め込み例

Google 基調講演 (Google I/O'19)

<iframe width="560" height="315" src="https://www.youtube.com/embed/lyRPyRKHO8M" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

自動再生

<iframe width="560" height="315" src="https://www.youtube.com/embed/lyRPyRKHO8M?autoplay=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

【動画は省略】

指定位置 (30:00)

<iframe width="560" height="315" src="https://www.youtube.com/embed/lyRPyRKHO8M?start=1800" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

日本語字幕

<iframe width="560" height="315" src="https://www.youtube.com/embed/lyRPyRKHO8M?cc_lang_pref=ja&cc_load_policy=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

指定位置 (30:00) ＋ 日本語字幕

<iframe width="560" height="315" src="https://www.youtube.com/embed/lyRPyRKHO8M?start=1800&cc_lang_pref=ja&cc_load_policy=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>