WordPress Block Editor

The WordPress Block Editor offers a fresh way to create and manage content in WordPress. Instead of treating your entire post or page as one big chunk, it breaks down your content into individual “blocks.” Each block represents a piece of your content—whether it’s a paragraph, image, heading, or list—allowing you to easily insert, rearrange, and customise each one separately.

WordPress Block editor with image block selected. The image highlights the Document Overview and Block Settings for this page.

As illustrated above:

  1. Click on the + to add a block or use the Document Overview to visualise page/post
  2. Each Block has its own settings – for example to align the block
  3. Each block is represented in the Document Overview. Click drag and drop the block to required position.
  4. Each block has additional settings to style it.
  5. Click on Page settings to sets its status, parent, order and more

Key Features of the Block Editor

  • It provides blocks for common content elements like paragraphs, headings, lists, quotes, and images. You can also add galleries, buttons, tables, and columns, offering more variety and flexibility than the old Classic Editor. Each Block has its own
  • Rearranging your content is simple. You can drag and drop blocks or use the arrows to move them up or down. Each block comes with its own set of styling options available in the toolbar, which appears above the block when selected. For example:
    • Paragraph blocks let you adjust text size, colour, and background color.
    • Heading blocks allow you to choose the heading level (H2, H3, etc.) and align the text.
    • Image and Gallery blocks to display images.

How to improve the Block Editor

I use the amazing GenerateBlocks plugin to enhance the editing experience and create well designed pages.

GenerateBlocks

Have total design freedom to create whatever you need using just 6 blocks.

1. Container

Organize your content into rows and sections.

2. Grid

Create advanced layouts with flexible grids.

3. Headline

Craft text-rich content with advanced typography.

4. Button

Drive conversions with beautiful buttons.

5. Image

Add static or dynamic images to your content and style them as you need.

6. Query Loop

Build a list of posts from any post type. Arrange blocks within blocks.

The best block-based theme builder! Get GenerateBlocks Pro today!

Fullscreen Mode

By default, WordPress opens the Block Editor in Fullscreen mode, which hides the sidebar menu and the top admin bar to give you more space to work on your content. If you prefer the traditional view with the menu and toolbar visible, you can disable Fullscreen mode:

  1. Click the Options icon (three vertical dots) in the top-right corner.
  2. Select Fullscreen mode to toggle it off.
WordPress Block Editor - Options menu showing Full Screen Mode toggle.

I prefer to work without Fullscreen mode.

How does the Block Editor handle media-rich content compared to the Classic Editor

With the Block Editor, managing content is much more intuitive, giving you more control over layout and design without the need for technical skills or custom code.

The Block Editor (Gutenberg) offers significant advantages over the Classic Editor when it comes to handling media-rich content:

  1. Dedicated Media Blocks: The Block Editor provides specific blocks for various media types, including images, videos, audio, and embeds. This makes it more intuitive to add and customize different media elements.
  2. Enhanced Customisation: With the Block Editor, users have more built-in options to customize media content. For example:
    • Image blocks allow for easy resizing, alignment, and adding captions.
    • Video blocks offer customization of playback settings and appearance.
  3. Flexible Layouts: The Block Editor’s modular approach allows for more complex layouts with media. Users can easily create multi-column designs, intersperse media with text, and rearrange content through drag-and-drop.
  4. Gallery Features: The Block Editor offers advanced gallery options, allowing users to create stunning image collages and set aspect ratios for a cohesive look.
  5. Video Backgrounds: Unlike the Classic Editor, the Block Editor allows users to set videos as backgrounds for sections, adding a dynamic element to content.
  6. Responsive Design: Media added through the Block Editor is automatically optimised for responsive design, ensuring proper display across different devices.
  7. Reusable Blocks: Users can save media-rich content as reusable blocks, making it easy to maintain consistent design elements across a website.
  8. Embed Support: The Block Editor streamlines the process of embedding content from external sources like YouTube, Twitter, or Instagram.

In contrast, the Classic Editor:

  • Requires the “Add Media” button for all media insertions.
  • Offers limited built-in customization options for media.
  • Relies more heavily on shortcodes or custom HTML for complex media layouts.

Overall, the Block Editor provides a more user-friendly and flexible environment for creating media-rich content, offering greater control and creativity without the need for additional plugins or coding knowledge.

Additional Information:

  • thrivethemes.com/wordpress-block-editor-tutorial/
  • wpmet.com/block-editor-vs-classic-editor/
  • wpbeginner.com/beginners-guide/how-to-use-the-new-wordpress-block-editor/
  • generateblocks.com

Get in touch


VJ Design - Web Design Melbourne
Affordable and creative web solutions from Melbourne, AU. I build robust fast-loading WordPress sites for a fraction of the price. Call VJ on +61389867186
Address :
106 Alamanda Blvd,
Point Cook,
VIC - 3030
Australia.
Tel : +61389867186
Email : hello@vjdesign.com.au

 Logo

Image of

$600-12000