The goal of this new editor is to make adding rich content to WordPress simple and enjoyable. This whole post is composed of pieces of content—somewhat similar to LEGO bricks—that you can move around and interact with. Move your cursor around and you’ll notice the different blocks light up with outlines and arrows. Press the arrows to reposition blocks quickly, without fearing losing things in the process of copying and pasting.
<div>Example of code block goes here</div>
Headings are separate blocks as well, which helps with the outline and organization of your content. What you are reading now is a text block the most basic block of all. The text block has its own controls to be moved freely around the post…
- Text & Headings
- Images & Videos
- Embeds, like YouTube, Tweets, or other WordPress posts.
- Layout blocks, like Buttons, Hero Images, Separators, etc.
- And Lists like this one of course 🙂
A huge benefit of blocks is that you can edit them in place and manipulate your content directly. Instead of having fields for editing things like the source of a quote, or the text of a button, you can directly change the content. Try editing the following quote:
Perfection is achieved not when there is nothing more to add, but when there is nothing left to take away.Matt Mullenweg, 2017
The information corresponding to the source of the quote is a separate text field, similar to captions under images, so the structure of the quote is protected even if you select, modify, or remove the source. It’s always easy to add it back.
If you combine the new wide and full-wide alignments with galleries, you can create a very media rich layout, very quickly:
Sure, the full-wide image can be pretty big. But sometimes the image is worth it. The above is a gallery with just two images. It’s an easier way to create visually appealing layouts, without having to deal with floats. You can also easily convert the gallery back to individual images again, by using the block switcher.
Any block can opt into these alignments. The embed block has them also, and is responsive out of the box. The information corresponding to the source of the quote is a separate text field, similar to captions under images.