見出し画像

noteにYouTubeショート動画を埋め込む方法

すこし苦戦したので、メモしておきます。PCでのやり方です。


やり方

YouTubeのショート動画をnoteに埋め込むには、以下のようにショート動画上で右クリックして、「動画のURLをコピー」をクリックして取得したURLをnoteに貼り付けます。

そうするとこのようにnote内で再生できる形で埋め込めます。

追記:YouTube側の仕組みのアップデートでこのやり方もダメになりました。

裏技として別のやり方があります。たとえば、上記のように右クリックしてコピーした動画のURLは以下の通りですが

https://www.youtube.com/shorts/RhVHszS3o-I

この最後の部分、RhVHszS3o-Iを以下のURLの最後につけると埋め込みできるようになります。

https://www.youtube.com/watch?v=

上記の動画だと、合体させると以下のようになります。

https://www.youtube.com/watch?v=RhVHszS3o-I

これをnoteにコピペすると埋め込みできます。

つまり、

https://www.youtube.com/watch?v=

にショート動画のURLの最後のIDっぽい部分(上記ならRhVHszS3o-I

を加えると埋め込みできるということです。アドレスバーや共有のURLも同じなので、スマホのYouTubeアプリから取得したURLも同様の方法で加工すれば、noteに埋め込みできると思います。

この裏技的な手法は、こちらのnoteを参考にさせていただきました。

うまくいかなかった例

共有ボタンからリンク取得

右側の共有から以下のような画面を開いて、URLをコピーすることもできますが、

そちらを貼り付けるとただのリンクになってしまいます。

ブラウザのURLをコピペ

また、ブラウザに表示されているURLもコピペできますが、

これを貼り付けても、以下のようにただのリンクになってしまいます。

埋め込みコードをコピペ

以下のように画面を右クリックしてから「埋め込みコードをコピー」もできますが、

以下のようにnoteに貼り付けても動画やリンクとして表示されませんでした。

<iframe width="473" height="841" src="https://www.youtube.com/embed/RhVHszS3o-I" title="キーボードを遠隔操作(スリープモード解除用・SwitchBot)" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

おわりに

今回はPC版でのやり方ですが、スマホでのやり方もわかったら追記します。

スマホのやり方も上記に書いた通り、アドレスを加工して埋め込みできます。

この記事が参加している募集

いつも読んでくださりありがとうございます!サポートは、お勉強代として活用させていただいております。