Skip to content

Building Dynamic Experiences combining different WordPress/Gutenberg features: Word Switcher project #417

@bph

Description

@bph

Discussed in #409

Originally posted by juanmaguitar October 1, 2025
The Word Switcher Core Blocks project demonstrates how developers can combine several key Gutenberg technologies to implement dynamic behaviors in blocks while keeping the editing experience intuitive and consistent. By extending core blocks, the project shows a practical path for using the editor itself as a framework for rich, interactive workflows.

This article would highlight how four important Gutenberg technologies—HTML API, Interactivity API, JS Modules, and Format API—are applied in this project, and how developers can adopt similar patterns in their own block-based solutions.

Key Points for the article:

  • HTML API: Ensuring reliable markup transformations when switching languages and preserving valid block output.
  • Interactivity API: Adding dynamic behaviors (e.g., toggling between translations) that feel seamless in both editing and front-end contexts.
  • JavaScript Modules: Structuring the project into reusable, maintainable pieces that integrate cleanly with WordPress build tools.
  • Format API: Extending inline text formatting options for contextual behaviors (like per-language inline markers).
  • Developer takeaways: How to combine these APIs to balance interactivity with a smooth editorial flow.

References:

Audience: WordPress developers building advanced block functionality, contributors exploring Gutenberg APIs, and anyone interested in pushing the block editor towards dynamic, interactive experiences.

[!Note]
This article could act as a case study: how a single project (Word Switcher) uses multiple Gutenberg APIs in combination, rather than isolated examples.

Metadata

Metadata

Assignees

Type

No type

Projects

Status

To-do

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions