Google Earth 動画を YouTube 経由でレスポンシブ対応 SSL サイトに埋め込み

作成した動画

地球全体が見渡せる位置から、ある特定の場所まで Zoom In する動画を作成し、YouTube にアップ。その動画を、レスポンシブ対応のワードプレスサイトに埋め込みました。

特に、難しいことを行ったわけではありませんが、若干戸惑ったポイントをメモ書きしました。

Google Earth Pro で、動画を作成し、
YouTube にアップ
httpsサイト上に、YouTube 動画を埋め込み
YouTube動画をレスポンシブ対応

Google Earth Pro で、動画を作成

Google Earth Pro を利用して、宇宙からある特定の場所までのズームイン動画作成しました。

この投稿を作成している段階では、Google Earth、Google Earth Pro 両方が存在しています。どちらも無料ですが、作成した動画を YouTube にアップするには、Google Earth Pro が必要です。

Google Earth ( Pro ) を利用した動画の作成方法は、いろいろなサイトに掲載されていますので、そのサイトをご参照ください。

私は、「GoProとEOSと旅行と釣りと・・・道楽ブログ」を参考にさせていただきました。

httpsサイト上に、YouTube 動画を埋め込み

通常は、該当する YouTube 動画のアドレスを、ダイレクトに記載すれば YouTube 動画は、簡単に埋め込まれるのですが、ページが表示された時に、自動で再生が始まるようにしたかったので、Google YouTube IFrame Player API （リファレンスページに記載されているサンプル script ）を、そのまま使用しました。（videoId と setTimeout は変更しています。）

下記のような、簡易的な埋め込み方法は、httpsサイトでは、利用できないみたいです.

<iframe id="player" type="text/html" width="640" height="360" src="http://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1&origin=http://example.com" frameborder="0"></iframe>