【ブロックエディター】YouTubeの開始位置を指定して動画を埋め込む方法！

クラシックエディターのときは、YouTubeの動画上で右クリック→「現時点の動画のURLをコピー」して貼り付けると、取得した時点から再生されるように動画を埋め込むことができました。

しかし、ブロックエディターの場合、YouTubeブロックに「現時点の動画のURLをコピー」したURLを入れても、全て最初から再生されてしまいます。

これがすごく不便だったので、今回はブロックエディターを使っている方に向けて、YouTubeの開始位置を指定して動画を埋め込む方法をご紹介いたします。

YouTubeの開始位置を指定して動画を埋め込む方法

ブロックエディターで開始位置を指定して動画を埋め込む方法は2つです。

• 共有から埋め込みコードを取得する
• カスタムHTMLで動画を埋め込む

共有から埋め込みコードを取得する

YouTubeの動画から開始位置を指定して、埋め込みコードを取得する方法です。

YouTube動画の下に共有ボタンがあるので、そちらをクリックします。

そうするとさまざまな共有方法が表示されるので、埋め込むをクリックします。

開始位置にチェックを入れ、時間を指定すると、その時間から再生されるようコードが修正されます。

今回は10秒から開始されるように指定しました。

修正されたコードをブロックエディターのカスタムHTMLに入力します。

これで記事内の動画を再生すると、しっかり10秒から始まっているのが確認できます。

カスタムHTMLで動画を埋め込む

上記と同じでカスタムHTMLを使う方法ですが、こちらはコピーしたURLを入力するだけです。

まずYouTubeで埋め込みたい動画を開きます。

開始位置に指定したい時間にシークバーを合わせ、「現時点の動画のURLをコピー」します。

これをそのままカスタムHTMLに入力します。

URLの最後が「t=〇」となっていれば、時間が指定できている状態です。

この状態で記事内の動画再生して見ると、10秒から始まっているのが確認できます。

※お借りした動画

使用ブロックや埋め込み方法による違いは？

YouTubeブロック、カスタムHTMLブロックどちらを使って動画を埋め込んでも、記事の表示速度や機能的な違いはありません。

ソースを見るとどちらもifameで埋め込まれており、使用しているブロックが違うため、クラス名が異なるくらいです。

ですので、開始位置を指定して動画を埋め込みたい場合、カスタムHTMLを使った方が簡単に埋め込むことができます。

ブロックエディターでYouTubeの開始位置を指定して動画を埋め込む方法まとめ

今回はブロックエディターでYouTubeの開始位置を指定して、動画を埋め込む方法についてご紹介しました。

かなりピンポイントな内容ですが、開始位置を指定して動画を紹介する記事などの場合、共有コードで動画を埋め込むのはかなり手間がかかります。

記事表示速度や機能的に影響が少ないのであれば、「現時点の動画のURLをコピー」してカスタムHTMLに入力するのが一番簡単です。

ぜひ試してみてください。