Magic Block

Registers a container block with the Gutenberg (WP5+) editor. This block has settings for element type (div, section, etc), id, classname, and style ( …

Author:Will Delphia (profile at wordpress.org)
WordPress version required:5.0
WordPress version tested:5.7.2
Plugin version:1.3.0
Added to WordPress repository:13-12-2018
Last updated:18-04-2021
Warning! This plugin has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.
Rating, %:98
Rated by:11
Plugin URI:
Total downloads:4 205
Active installs:500+
plugin download
Click to start download

Magic Block registers a container block with the block editor. This block has settings for element (div, section, etc), ID, classname, inline style, and any other attribute (including data-*, and aria-*) via a custom attributes section.

Magic Block is designed for people who want full control over post HTML structure, or wish to use the editor to create complex layouts such as Flexbox, CSS Grid, Bootstrap, etc…

This block does not add any CSS styles that you, as a developer, do not provide. Rather, it allows you to easily contain other blocks in parent elements with an arbitrary ID or Class. You may then easily target these container elements by ID or Class in your theme’s stylesheets or through CSS plugins. For smaller customizations there is an inline style field which maps to the “style” HTML attribute for the container element.

In the editor view, each Magic Block has a thin grey outline so you can easily see which child elements belong to it. It also provides a display of element type, ID, and classes so you can keep track of how to target them with your CSS.

As of WordPress 5.3 you might not need this plugin since the core now ships with a “Group Block” which is similar in purpose, although it has fewer options.


Screenshots