Embeds

Available blocks: YouTube & Vimeo | Social Media | Sound Cloud

Embeds display content pulled from other sites, like YouTube, Vimeo or Twitter.

YouTube and Vimeo

YouTube and Vimeo embeds can be added through the block or simply paste the URL into the editor and press return. Alignment options are available in the block toolbar. The blocks work similar to each other.

The following is a full-width YouTube block.

Full width Youtube embed of a young Barred Owl calling to its parents.

An example of No Alignment with a Transcript:

Dedicated to advancing the understanding and protection of the natural world, the Cornell Lab joins with people from all walks of life to make new scientific discoveries, share insights, and galvanize conservation action.
Show Transcript

[upbeat music] [drone footage of the Cornell Lab of Ornithology]

[Sapsucker peers out of nest hole]

What bird is that?

[American Robin at nest, feeding caterpillars to young]

How much do they eat?

[Rose-bellied bunting perched on a small twig]

Why are they so colorful?

[Western Parotia dancing side-to-side]

What’s that bird doing?

End of Transcript

Left alignment.
Right alignment with transcript.
Show Transcript

[upbeat music] [drone footage of the Cornell Lab of Ornithology]

[Sapsucker peers out of nest hole]

What bird is that?

[American Robin at nest, feeding caterpillars to young]

How much do they eat?

[Rose-bellied bunting perched on a small twig]

Why are they so colorful?

[Western Parotia dancing side-to-side]

What’s that bird doing?

End of Transcript

Videos can also be aligned to the right or left of content. If an aligned video also has an accompanying transcript, add it to a group with a “sidebar” style so it can be placed under the video. To make the video slightly wider, use the Featured Media toggle under the Block Styles & Settings panel.

Video Embed Options

The embed block will typically pick up a video’s ration (4:3 or 16:9). On the occasion that it does not display the ratio properly, it can be overridden under the Block Styles & Settings panel in the block sidebar in the Aspect Ratio dropdown.

Options are available for caption display in the block sidebar under the Caption Styles panel. They include caption alignment and adding a border under the caption.


Social Media Embeds

Twitter

Twitter can also be embedded through the block or by pasting the status URL directly into the editor.

Facebook and Instagram

Facebook and Instagram no longer allow direct embeds using Gutenberg blocks. You can embed posts from these sites using the HTML block and embed code from each site.


Sound Cloud

Add a sound cloud embed through the Sound Cloud block, or paste the URL into the editor for an automatic embed. Both playlists and individual sounds can be embedded.

Playlist Example