Emmet-style shorthand for creating Gutenberg blocks via keyboard shortcut.

Aki Hamano

Custom HTML Block Extension

Extend Custom HTML block to evolve into the advanced code editor.

rewish

WP Emmet

Abu Hayat

bPlugins

Charles Cormier

Murad Wahid

ShortCut and Dummy Text Generator

Generate complex Gutenberg block structures instantly using Emmet-like shorthand syntax. Type an abbreviation, press Tab or Enter, and watch it expand …

TinkerGrove

BlockExpander enables a fast, code-inspired workflow for assembling page structures in the WordPress block editor using Emmet-style shorthand syntax.
How It Works:
<ol>
<li>Press <code>Ctrl+Shift+E</code> (or <code>Cmd+Shift+E</code> on Mac) to open the BlockExpander modal</li>
<li>Enter an Emmet expression (e.g., <code>columns>column*3>paragraph</code>)</li>
<li>Press Enter to expand the expression into blocks</li>
<li>Blocks are inserted at your cursor location</li>
</ol>
Syntax Examples:
<ul>
<li><code>paragraph</code> – Creates a paragraph block</li>
<li><code>columns>column*3</code> – Creates a columns block with 3 columns</li>
<li><code>group.container</code> – Creates a group block with class “container”</li>
<li><code>group#hero</code> – Creates a group block with anchor “hero”</li>
<li><code>paragraph{Hello World}</code> – Creates a paragraph with custom text</li>
</ul>
Features:
<ul>
<li>Familiar Emmet syntax for rapid block creation</li>
<li>Keyboard-triggered modal for seamless workflow</li>
<li>Supports nesting, multiplication, classes, IDs, and text content</li>
<li>Automatic Lorem Ipsum placeholder text for content blocks</li>
<li>Fully compatible with all core Gutenberg blocks</li>
</ul>

Alternatives to BlockExpander

Top alternatives