Ver 1.3.1 coming soon

記事にツイートやYouTube動画などを埋め込む

この記事はSANGOカスタマイズガイドの「記事にツイートやInstagram、YouTube動画を埋め込む」を転載したものです。

WordPressでは、YouTube動画やツイートを簡単に埋め込むことができます。

ツイートを埋め込む

ツイートを埋め込みたいときは、そのツイートのURLをエディタに貼り付けるだけでOKです。何かのタグで囲う必要はありません。

これで下のようにツイートが埋め込まれます。

注意
ただし、URLが貼られる行の前後には改行をはさむようにしてください。URLと同じ行に文字などが含まれているとURLがそのまま表示されてしまいます。

Instagramを埋め込む

Instagramの写真を埋め込みたいときも、その写真のURLをエディタに貼り付けるだけでOKです。


YouTube動画を埋め込む

YouTube動画についても、URLをエディタ上にペーストするだけで埋め込むことができます。ただし、注意したいのがこのままだとスマホで見たときに左右が切り取られてしまいます(高さが保たれてしまうのですね)。

動画の縦横比をレスポンシブに固定する方法

SANGOでYouTubeのレスポンシブ対応用のショートコードを用意しておきました。使い方は簡単。動画のURLを[youtube]〜[/youtube]ではさむだけです。

使い方例
[youtube]
https://動画のURL
[/youtube]

これでスマホ表示でも動画の縦横比が保たれるようになります。

MEMO

ショートコードの中に入れるのはiframeタグ(YouTubeで埋め込み共有を選んだときに表示されるコード)でもOKです。


地図を埋め込む

以下のように地図を埋め込むこともできます。Google Mapのメニューの「地図を共有または埋め込む」⇒「地図を埋め込む」からコードを取得できます。これを「テキスト」エディタの方へとコピペすればOKです。