もっと機能を追加
地図の埋め込みや、FacebookやTwitterのタイムラインなどを表示する方法を見ていきましょう。
Googleマップの埋め込み
- Google マップ を開きます。
- 埋め込みたい地図やストリートビュー画像を地図上に表示します。
- 左上のメインメニュー
をクリックします。
- [地図を共有または埋め込む] をクリックします。
- 表示されるボックスの上部で [地図を埋め込む] タブを選択します。
- ご希望の埋め込みサイズを選択し、そのコードをコピーしてウェブサイトのソースコードに貼り付けます。
YouTube動画の埋め込み
- You Tube を開きます。
- 埋め込みたい動画を表示します。
- 動画の下にある [共有] をクリックします。
- [埋め込みコード] をクリックします。
- その下に表示されるボックス内のコードをコピーします。
- ウェブサイトのHTMLファイルをエディタで開き、動画を表示したい場所にコードを貼り付けます。
Xタイムラインの埋め込み
- https://publish.twitter.com/に移動します。
- 埋め込みたいタイムラインのリンクを入力します。
- ウェブサイトに合った高さや テーマ（明るいか暗いか） を指定して、デザインをカスタマイズします。
- コードをコピーし、自分のウェブサイトのHTML上で、タイムラインを表示したい場所にペーストします。
- これで完了です。
Facebookタイムラインの埋め込み
- Page Plugin を開きます。
- 埋め込みたいFacebookページを[Facebook Page URL]に入力します。
- 希望の埋め込みサイズとオプションを選択し、[Get Code] をクリックします。
- 2つのコードが表示され、1つ目のコードを <body>開始タグのすぐ下 に貼り付けます。
- 2つ目のコードは表示したい場所に貼り付けます。
※注意点として、サーバ上でないとFacebookのタイムラインは表示されません。
Googleカレンダーの埋め込み
- パソコンで Google カレンダー を開きます。
- 右上にある設定アイコン
> [設定] をクリックします。
- [カレンダー] タブを開きます。
- 埋め込むカレンダーの名前をクリックします。
- [このカレンダーを埋め込む] セクションに表示される iframe コード をコピーします。
- ウェブサイトのHTMLファイルをエディタを開き、カレンダーを表示したい場所にコードを貼り付けます。
- 埋め込まれたカレンダーは、あなたがカレンダーを共有したユーザーにのみ表示されます。
すべての訪問者がカレンダーを閲覧できるようにするには、カレンダーを一般公開する必要があります。