| WordPress

How to Add Widgets and Embeds in Gutenberg

The Gutenberg editor has revolutionized how we write in WordPress.

Gutenberg didn't only change how we write posts, but it also exposed many more WordPress features. In the old, "Classic" editor, you had a formatting toolbar that looked like Microsoft Word. In Gutenberg, you have the formatting options, but also easy access to extra features. Two of those new features are Widgets and Embeds. These are WordPress features that were previously very difficult to access when writing posts.


Video introduction to Widgets and Embeds

This video is part of our Gutenberg class on YouTube and explains how to use widgets and embeds in Gutenberg.

Save 60% on your first invoice when you host your WordPress site with GlowHost. Click this link and use the coupon "WPGUTENBURG" .


How to add Widgets in Gutenberg

At the moment, only 4 of the default WordPress widgets are available in Gutenberg, but more are coming in future versions. Currently, Gutenberg offers these:

  • Archives
  • Categories
  • Latest Comments
  • Latest Posts

To be honest, in the near future, we'll probably stop referring to "Widgets" and just referring to these items as blocks. The WordPress team are working to convert all widgets to blocks. When you want to add a "Search", "Tag Cloud", or even a "Navigation Menu" to your site, you won't be using widgets ... you'll be using blocks.

To access Widgets in Gutenberg, click the + icon in the top-left corner of Gutenberg, as shown below:

gutenberg widgets


How to Add Embeds in Gutenberg

Embeds have long been a mysterious feature in WordPress. Some people knew that you could add a YouTube URL into your posts, and then it would automatically convert to a video. However, there was no obvious sign that this was possible, and many people missed it.

Now, when you add a new block in Gutenberg, you'll see a list of specific blocks. No longer do you have to guess whether or not WordPress supports a particular site that you want to use.

gutenberg embeds

This embed feature has already been extended. Check out popular plugins such as EmbedPress that add on even more embed options. In the image below, you can see that EmbedPress has added Gutenberg support for Google Docs, Google Sheets, Google Forms, Google Drawings, Google Slides, and Google Maps.

embedpress


About the author

Steve is the founder of OSTraining. Originally from the UK, he now lives in Sarasota in the USA. Steve's work straddles the line between teaching and web development.