プログラミング

【HTML】iframeタグで動画を埋め込む

投稿日:

会社のイントラで「frameタグ」を使用していたんですが、今はもう廃止されているんですね。
その代替えとして「iframeタグ」というものがあったので紹介します。
今回は、自分の好きな動画をWEBページに埋め込んでいきます。

iframeタグとは

WEBページは通常「htmlタグ」の中に文章を記述して、表示されています。
簡単に言っちゃうと、その「htmlタグ」の中に別の「htmlタグ」を入れるのが「iframeタグ」になります。
WEBページの中に、小さくなった別のWEBページが入ってるイメージですね。

iframeタグの使用例

では、「iframeタグ」はどう使われているんでしょうか。

  • Youtubeの埋め込み
  • ブログ記事の埋め込み
  • amazon等の商品ページの埋め込み
  • 地図の埋め込み
  • SNSの埋め込み

他にも様々な使用例があります。
色んな使い方ができて、便利ですね。

これが「YouTube」の動画を埋め込んだものです。
自分の好きなアーティストの「竹渕慶」さんのMVです。
ぜひご覧ください。

動画の埋め込み方法

「iframeタグ」の使用例として、「YouTube」の動画の埋め込み方法を紹介します。
動画を埋め込むうえで注意事項があるので、事前にしっかり確認しましょう。
「YouTube」の利用規約はこちら。

埋め込みたい動画を開く

共有をクリックします。

埋め込むを選択

埋め込むを選択しましょう。

コードをコピーしよう

コピーしていきましょう。

貼り付ける

コピーしたものを貼り付けます。
コードを見てわかるように「iframeタグ」が記述されていますね。

完了

これで埋め込み完了です。

まとめ

「iframeタグ」を使うことで、ほかのWEBページを手軽に埋め込むことができますし、情報を更新したい場合は「iframeタグ」の中だけをメンテナンスすればいいですね。
使いこなしていきたいものだと思います。
以上、「iframeタグ」でした。
それではまた。

-プログラミング

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

【Excel VBA】ユーザーフォームを使ってみよう1

Excel VBAで使える「ユーザーフォーム」を使っていきたいと思います。この記事では「ユーザーフォーム」の挿入と表示までやっていきます。 Excel VBAとは? VBAでお仕事効率化 VBAの開き …

【Python】グラフを作成してみよう

Pythonでは、グラフを作成することも出来ます。今回は、実際にグラフの作り方を見ていきたいと思います。 Pythonでグラフを描いてみよう Pythonでグラフを作成するには「matplotlib」 …

【エクセル】で「ちょこっとプログラミング」発展編#1

プログラミングをしたことのない人向けにExcelでできる「ちょこっとプログラミング」を紹介します。今回は「セルの値を取得する」の【発展】として「空白のセルまで値を取得する」を題材にやっていきます。 基 …

【エクセル】VBAで変数の宣言

以前に、エクセルでできる「ちょこっとプログラミング」を書きました。そのなかで「変数の宣言」について触れたんですが、今回はもう少し掘り下げて紹介していこうと思います。 以前の記事はこちら。 【エクセル】 …

【Excel VBA】ユーザーフォームを使ってみよう2

前回に引き続き「ユーザーフォーム」を使っていきたいと思います。今回はフォームのデザインを作っていきましょう。 前回の記事はこちら 【Excel VBA】ユーザーフォームを使ってみよう1 ユーザーフォー …

YouTube