はじめてのWordPress入門講座【基礎知識・基本的な使い方・トラブル対応】

TikTokの動画をブログやWebサイトに貼り付ける(埋め込む)方法

TikTokの動画をブログやWebサイトに貼り付ける(埋め込む)方法

こんにちは。遠藤(@webmaster_note)です。昨日の記事「noteでTikTokの動画を埋め込める!埋め込む方法を紹介 | WEBマスターの手帳。」でTikTokの動画を貼り付けたのですが「どうやって貼り付けたの?」という質問がありました。

TikTokの動画をブログやWebサイトのページに貼り付ける(埋め込む)方法をご紹介します。

TikTokの動画をブログやWebサイトのページに貼り付ける(埋め込む)方法

TikTokの動画をWebサイトに貼り付けると、↓のように、Webサイト上でTikTokの動画を視聴することができます。

PCブラウザでTikTok動画を開く

TikTokの動画をWebサイトに貼り付けるには、貼り付けたいTikTokの動画をPCブラウザで開く必要があります。

TikTokはスマートフォンアプリで視聴している人がほとんどだと思うので、PCブラウザで視聴するのに違和感があるかもしれませんが、TikTokの動画はPCブラウザでも視聴することができます。

まずはWebサイトに貼り付けたいTikTokの動画URLを取得します。方法は「noteでTikTokの動画を埋め込める!埋め込む方法を紹介 | WEBマスターの手帳」の「まずはTikTokの動画URLをコピーする」に記載していますので、そちらをご参照ください。

TikTokの動画URLを取得(コピー)したら、PCブラウザで、その動画URLを開きます。

TikTokの動画埋め込みコードを取得する

TIkTokの動画をPCブラウザで見る

そうすると動画のコメント欄の下に、Twitter、Facebookのシェアボタンがあって、その右横に「</>」アイコンがあります。

TikTokの動画の埋め込みコード

この「</>」が「埋め込みコード」です。ここをクリックするとifrrameの埋め込みコードを取得する(コピーする)ことができます。

TikTokの動画の埋め込みコードをコピーする

あとはコピーした埋め込みコードを、WebサイトのTikTok動画を表示させたい箇所に、貼り付ければ完了です。

PCブラウザで動画を開かないと「埋め込みコード」が取得できないのは、少し手間を感じるかもしれません。私が確認したところスマートフォンアプリでは「埋め込みコード」を取得することはできないようです。

そもそもWebサイトにTikTokの動画を貼り付ける機会が多くはないと思いますが「Webサイトに貼り付けることができる」と参考にしてください。