YouTube埋め込みコード生成ツール

YouTubeのURLを貼るだけで、ブログやWebサイト用の埋め込みコード(iframe)を作成します。開始・終了時間、自動再生、ループ、字幕、スマホ対応のレスポンシブ表示などをプレビューで確かめながら設定でき、「1分23秒から」のような時間指定リンクも作れます。

動画ページ・共有ボタン(youtu.be)・ショート・ライブ・再生リストのURL、11桁の動画ID、すでに使っている埋め込みコード(iframe)のどれでも貼り付けられます。

再生する範囲

「1:23」「0:01:23」のような時:分:秒、または「83」のような秒数で入力します(「1分23秒」「1m23s」も可)。終了時間は動画の先頭からの時刻です。空欄なら指定しません。

サイズ

表示エリアの横幅いっぱいに広がり、高さは縦横比から自動で決まります(CSSの aspect-ratio を使用)。パソコンでもスマホでもはみ出しません。

大きな画面で広がりすぎないように上限を決めます。指定すると中央に配置します。縦長(9:16)を選ぶと自動で360を入れます。

再生のしかた

ページを開いたときに自動で再生を始めます。多くのブラウザは音が出る自動再生を止めるため、オンにするとミュートも自動でオンになります。

音を消した状態で再生を始めます。視聴者はプレーヤーの音量ボタンで音を出せます。

最後まで再生したら最初に戻って繰り返します。1本の動画では loop=1 と playlist=(同じ動画ID)を一緒に書き出します。

iPhoneで再生したときに全画面へ切り替わらず、ページの中で再生します。

プレーヤーの表示

オフにすると再生ボタンなどの操作部分を隠します(controls=0)。背景のように流したい動画に向いています。

視聴者が字幕をオフにしていても、字幕付きで再生します。字幕がない動画では表示されません。

字幕を表示するときに優先する言語です(cc_lang_pref)。その言語の字幕がない動画では反映されません。「指定しない」なら視聴者の設定に合わせます。

再生ボタンやメニューなど、プレーヤー自体の表示言語です(hl)。

全画面表示のボタンを隠し、コードから allowfullscreen 属性も外します。

スペースキーでの再生・停止や矢印キーでの早送りなど、プレーヤーのキーボード操作を無効にします。

2018年の仕様変更で、関連動画を完全に消すことはできなくなりました。オンにすると、表示される関連動画がこの動画と同じチャンネルのものに限られます。

プライバシー・表示速度・読み上げ

埋め込み先のドメインを www.youtube-nocookie.com に変えます。このモードでの視聴は、閲覧者の YouTube でのおすすめなどに反映されません。

動画が画面に近づくまでプレーヤーの読み込みを遅らせ、ページを速く表示します。

スクリーンリーダー(画面の読み上げ)で読まれる名前です。「〇〇の使い方(YouTube動画)」のように内容がわかる名前にすると親切です。空欄なら「YouTube動画」になります。

プレビュー

動画のURLを入力すると、ここで実際の表示を確認できます。

プレビューは YouTube の実際のプレーヤーです。自動再生されるかどうかは、ブラウザの設定によって変わります。固定サイズは実寸で表示し、枠に収まらないときは枠の中でスクロールできます。

使い方

1

動画のURLを貼り付ける

YouTubeで埋め込みたい動画を開き、アドレスバーのURLか「共有」ボタンのリンクをコピーして入力欄に貼り付けます。ショート・ライブ・再生リストのURLや、11桁の動画IDでもかまいません。

2

再生方法とサイズを選ぶ

開始・終了時間、自動再生、ループ、字幕、サイズ(レスポンシブ/固定)などを選びます。変更はすぐにコードとプレビューに反映されます。迷ったら初期設定のままで大丈夫です。

3

コードをコピーして貼り付ける

「コードをコピー」を押し、ブログやWebサイトのHTMLに貼り付ければ完了です。WordPressでは「カスタムHTML」ブロックに貼ります。途中から再生される共有リンクが欲しいときは「時間指定リンク」タブを使います。

YouTube埋め込みコード生成ツールとは

YouTube動画を自分のブログやWebサイトに表示するためのHTML(iframeタグ)を作るツールです。YouTubeの「共有」→「埋め込む」で出るコードでは選べない、終了時間・ループ・字幕・プレーヤーの言語・キーボード操作の無効化や、スマホでもはみ出さないレスポンシブ表示などを、チェックを入れるだけで指定できます。iframe の属性は YouTube 公式のコードと同じものを使うので、そのまま安心して使えます。コードの生成はすべてブラウザの中で行われ、入力したURLがサーバーに送られることはありません。

機能・特徴

  • 公式の埋め込みより細かく設定開始時間に加えて、終了時間・ループ・字幕・プレーヤーの言語・全画面ボタンやキーボード操作の無効化まで、YouTubeの「埋め込む」画面にない項目も選べます。
  • スマホでもはみ出さないレスポンシブCSSの aspect-ratio を使うシンプルな方式と、div で囲む従来の方式から選べます。ショート動画の縦長(9:16)や最大幅の指定にも対応しています。
  • 実物のプレーヤーでプレビュー設定を変えると少し遅れてプレビューが更新され、開始位置やサイズ感をその場で確認できます。
  • 時間指定リンクも作成「1分23秒から」のような共有リンクを、youtu.be の短縮形式と通常形式の両方で作ります。共有URLに付く追跡用のパラメータ(si=)は自動で取り除きます。
  • 今の埋め込みコードを作り直せる使っている埋め込みコードを貼り付けると、開始時間や自動再生などの設定を読み取り、レスポンシブなどに作り直せます。
  • ブラウザだけで完結コードの生成はすべてお使いのブラウザの中で行われます。入力したURLや設定が当サイトのサーバーに送られることはありません。

活用シーン

  • ブログ記事やお知らせに、解説動画・商品紹介動画を貼る
  • 長い動画の「見てほしい部分」だけを、開始・終了時間を決めて埋め込む
  • 店舗サイトやLPのメインビジュアルで、ミュート+ループの雰囲気動画を流す
  • スマホで読まれるページに、はみ出さないレスポンシブ表示で動画を載せる
  • SNS・メール・LINEで「1分23秒から見てね」と時間指定リンクを送る

YouTube埋め込みの主なパラメータ

埋め込みURLの「?」のあとに「名前=値」を「&」でつないで指定します。当ツールでは、チェックを入れるだけでこれらを正しく書き出せます。

書き方意味
start=8383秒(1:23)の位置から再生を始めます。
end=165動画の先頭から165秒(2:45)の位置で再生を止めます。
autoplay=1自動再生します。多くのブラウザでは mute=1 と組み合わせたときだけ動作します。
mute=1ミュート(消音)で再生を始めます。
loop=1&playlist=IDループ再生します。1本の動画では playlist に同じ動画IDを指定します。
controls=0再生ボタンやシークバーなどのコントロールを隠します。
cc_load_policy=1字幕を最初から表示します。
cc_lang_pref=ja優先する字幕の言語を指定します(ISO 639-1 の言語コードなど)。
hl=enプレーヤーのボタンやメニューの表示言語を指定します。
fs=0全画面ボタンを表示しません。
disablekb=1プレーヤーのキーボード操作を無効にします。
playsinline=1iPhoneで全画面にせず、ページの中で再生します。
rel=0関連動画を同じチャンネルの動画に限定します(非表示にはできません)。
videoseries?list=PL…再生リストを埋め込みます。
modestbranding=1 / showinfo=0廃止済みで、今は指定しても効果がありません(modestbranding は2023年、showinfo は2018年に廃止)。

よくある質問

自動再生を設定したのに、動画が自動で再生されません。
Chrome・Safari・Edge などの主要ブラウザには、音が出る動画が勝手に再生されるのを防ぐ「自動再生ポリシー」があり、音声付きの自動再生は多くの場合ブロックされます。そのため当ツールでは、自動再生をオンにするとミュートも自動でオンにしています。iPhoneでは「iPhoneでページ内再生」もオンにしないと自動再生されないことがあります。また、スマホの省電力(低電力)モードやブラウザの設定によっては、ミュートでも再生されない場合があります。なお、YouTubeのヘルプでは、自動再生された埋め込み動画は再生回数に加算されないと案内されています。
動画をループ(繰り返し)再生させるには?
「ループ再生する」をオンにしてください。1本の動画を埋め込みでループさせるには、loop=1 に加えて playlist= に同じ動画IDを指定する方法が YouTube の公式ドキュメントで案内されており、当ツールはこの2つを自動で書き出します。再生リストを埋め込んだ場合は loop=1 だけでリスト全体を繰り返します。開始・終了時間と組み合わせると、2回目以降は動画の最初から再生されるなど、指定した区間どおりに繰り返されない場合があります。特定の区間だけを何度も見たいときは、YouTubeリピート再生ツールを使うと確実です。
「rel=0」で関連動画を非表示にできますか?
現在はできません。YouTubeの仕様変更(2018年)により、rel=0 は「関連動画を表示しない」ではなく「表示する関連動画を、再生した動画と同じチャンネルのものに限定する」という意味に変わりました。関連動画そのものを完全に消すパラメータは提供されていません。自分のチャンネルの動画を埋め込むなら、「関連動画を同じチャンネルの動画に限定する」をオンにすると、他のチャンネルの動画が関連動画に出ないようにできます。
プライバシー強化モード(youtube-nocookie.com)とは何ですか?
埋め込みに使うドメインを www.youtube.com から www.youtube-nocookie.com に変えるモードです。YouTubeのヘルプによると、このモードで表示された動画の視聴は、閲覧者が YouTube で見るおすすめ動画などのパーソナライズに使われず、広告が表示される場合もパーソナライズされない広告になります。ただし、Cookie などをまったく使わないことまでは保証されておらず、ページを開けば YouTube のサーバーとの通信も発生します。プライバシーポリシーで外部サービスの利用を説明しているサイトなどで、よく選ばれる設定です。
WordPressに貼り付けるにはどうすればいいですか?
ブロックエディタ(Gutenberg)では、「+」ボタンから「カスタムHTML」ブロックを追加し、コピーしたコードをそのまま貼り付けます。ブロック上部の「プレビュー」で表示を確認できます。クラシックエディタでは「テキスト」タブに切り替えてから貼り付けてください。管理者・編集者以外の権限(投稿者・寄稿者)やマルチサイト環境では、保存時に iframe が取り除かれることがあります。表示されない場合は、ユーザー権限やセキュリティ系プラグインの設定も確認してください。
スマホで見ると動画がはみ出したり、表示が崩れたりします。
サイズを「レスポンシブ(おすすめ)」にしてください。動画の横幅を表示エリアいっぱい(width:100%)にし、高さを CSS の aspect-ratio で縦横比どおりに自動調整するので、パソコンでもスマホでもはみ出しません。テーマによって崩れる場合は「divで囲む従来の方法」を試してください。固定サイズ(例: 560×315)は、画面幅の狭いスマホでは、はみ出しや横スクロールの原因になります。パソコンで大きくなりすぎるのが気になるときは「最大幅」を指定してください。
開始時間・終了時間はどのように指定しますか?
「1:23」「0:01:23」のような時:分:秒の形式か、「83」のような秒数で入力します(「1分23秒」「1m23s」も使えます)。コードには start=83 のように秒数で書き出されます。終了時間は「開始からの長さ」ではなく「動画の先頭からの時刻」で指定し、その時刻で再生が止まります。「t=83」などの再生位置が付いたURLを貼り付けた場合は、その時刻が開始時間に自動で入ります。
埋め込んだ動画が表示されない・エラーになるときは?
次の点を確認してください。①動画の投稿者が埋め込みを許可していない(「動画を再生できません」などと表示されます)。②非公開・削除済み・年齢制限付きなど、埋め込みでは再生できない動画である。③ iframe に referrerpolicy="no-referrer" を付けたり、サイト全体でリファラー(どのページから来たかの情報)を送らない設定にしたりすると、YouTube側でエラー(エラー153など)になる場合があります。当ツールのコードは YouTube 公式と同じ referrerpolicy="strict-origin-when-cross-origin" を使っています。④ CMSが iframe を削除していないか、セキュリティ系プラグインやコンテンツセキュリティポリシー(CSP)で youtube.com(プライバシー強化モードなら youtube-nocookie.com)が許可されているかも確認してください。
ショート動画や再生リストも埋め込めますか?
はい。ショート動画のURL(/shorts/)を貼り付けると、通常の埋め込み形式に変換し、縦横比を縦長の9:16に切り替えます。縦長の動画は横幅いっぱいに広げると大きくなりすぎるため、最大幅に360pxを自動で入れています。再生リストのURL(list=)を貼り付けると、リスト内の動画を順番に再生する埋め込みコード(videoseries)を作ります。動画と再生リストの両方を含むURLでは、「再生リストとして埋め込む」をオンにすると、その動画から順に再生されます。