Working with blocks
Blocks are individual elements containing all the content you add to a post or page. They can be easily rearranged by dragging and dropping within the editor. Blocks include text such as paragraphs, lists, headings; individual images and image galleries; embeds from YouTube, Vimeo, Soundcloud, Prezi, Twitter, and more; and visual elements such as separators and buttons. This makes it much easier to customize page layouts to create beautiful layouts without any coding.
The following screencast from the support team at the City Tech’s OpenLab provides an introduction to the Block Editor:
Frequently used blocks
Paragraph
Each paragraph of text is a separate block. This is the default block type, so when you finish a paragraph and press enter/return, a new paragraph block is automatically added.
The paragraph block includes all of the formatting options available in the Classic editor, plus more, including adding background colors, changing font size, adding a drop cap, and more.
Read more on WordPress.org about the paragraph block and its formatting options.
Heading
Headings are important for readability and accessibility because they help to structure the information you present, making it easier to scan and easier to navigate with screen readers. In the Block editor, each heading is a separate block, which you can add and then choose the appropriate heading level (e.g. H1, H2, H3).
Read more on WordPress.org about the heading block and its formatting options.
Image
Each image is added as a separate image block. In the block settings you can add alt text, and customize your image in many ways, including resizing, changing the alignment, adding a caption, and more.
Read more on WordPress.org about the image block and its formatting options.
Video
To embed an image from YouTube, Vimeo, or another video hosting service, you will add a Video block, click Insert from URL, and paste in the URL for the video.
Read more on WordPress.org about the video block and its formatting options.
Adding a block
There are many block types to choose from, which you’ll see organized by category and by most recently used when you add a block. Individual blocks often come with their own formatting settings for even greater control over layout and function.
There are multiple ways to add a block and choose the block type you need.
1. Click the blue + icon in the top toolbar in the upper left corner of the editor.
2. Click the black + icon to the bottom right side of any empty block.
3. Click the blue ‘+’ icon between two existing blocks.
4. Press the Enter/Return key from a selected block to create a new paragraph block below it. To choose a different type of block, you can type a forward slash (/) followed by the block name—for example: /image, to add an image block, as shown below.
Moving a block
You can use the up and down arrows in the block toolbar to move a block up or down on a post or page.
Customizing a block
Each block has its own settings, which will differ depending on the type of block. To find them, click on a block and you will see a toolbar appear at the top of the editor. There are also more settings in the sidebar on the right side.
If you don’t see the Block settings on the right sidebar of the editor, click the sidebar icon (next to the Publish/Update button) to expand the sidebar menu.
Block Toolbar: More options menu (3 dots menu)
Click the three dots icon on the far right side of the block toolbar for additional options for the block. Learn more about this menu on wordpress.org.
Deleting a block
To delete a block, select the block and click the three dots icon to access the More options menu. At the bottom of the menu, choose Delete.
Changing a block to a different type
You can transform any block to another similar block type. For example, you can change a paragraph to a heading, a list, or a quote.
Click the icon in the block toolbar for the active block (paragraph in the example below) and choose the block type you’d like to transform it to.
Patterns
Patterns are blocks that have been saved with all formatting and content to be used again on your site, even in a different post or page. These can be helpful if you tend to use the same content and/or formatting in multiple places.
To create a pattern, select the block you want to save, click the three dots icon in the block toolbar, and click Create pattern.
To use a pattern, add a block as usual, and in the block library, you’ll see a section for patterns, where you can find all patterns you’ve saved.
Block list view
Block list view is a list of all the blocks you have included in your post or page. It makes it easy to see the structure of your post, and easily jump to a block you’d like to work on. The block list view is especially useful for selecting hard to reach blocks, such as an individual block inside a group block, or parts of a list block.
To access the block list view, click on the icon with three horizontal lines in the block toolbar.
Document settings: Sidebar
The Document settings menu in the right sidebar is where you can add categories and tags, choose a featured image, see and change the status of your post, and more. These are options that apply to the entire post or page, rather than an individual block. You can find these settings in the same place as the Block settings. They’re in a different tab, so click Document to access the document settings.
Click the down arrow next to each header in Document settings to edit the specific options.
This article is adapted from City Tech OpenLab Help, under a CC BY-NC-SA license.
Was this helpful?
0 / 0
