Built a conversion workflow that transforms valid HTML into editable Gutenberg block code, with options for block title, slug, namespace, category, and asset dependencies.
OPEN-SOURCE ENGINEERING
HTML to Gutenberg
From frontend markup to editable WordPress blocks.
A developer tool that turns HTML into editable WordPress Gutenberg blocks—reducing the manual work between a finished frontend design and a reusable CMS component.
THE CONTEXT
The challenge
The original workflow combined manual HTML-to-Gutenberg conversion with WordPress block integration, including ACF-based components. Each new block required translating markup and styles into the editor’s block structure and supporting code. The work began as a way to reduce that repetitive setup, then evolved into a reusable developer tool.
THE WORK
What was built
Extended the tool from local file generation into a package-oriented workflow, including an asynchronous job mode and a JSON manifest for generated output.
Added asset handling and packaging: downloaded page assets can be uploaded to Cloudflare R2, and generated bundles are compressed in memory before upload.
Maintained a legacy output mode for existing tooling while evolving the package and its documentation.
CAPABILITIES
What it enables
Editable block output
Transform HTML into WordPress Gutenberg blocks that can be edited in the block editor.
Asset-aware conversion
Resolve and collect supporting CSS, JavaScript, and page assets as part of the workflow.
Two output paths
Use legacy local output or job-based output that returns a structured manifest.
Cloud packaging
Upload generated files to Cloudflare R2 and package the output ZIP in memory.
EVIDENCE
What can be verified
Open-source repository with implementation, usage documentation, and tests.
The npm package metadata identifies version 4.2.26 and describes HTML-to-Gutenberg conversion.
620 npm downloads between 4–10 November 2026, according to the public npm downloads API.
17,160 npm downloads between 11 November 2025 and 10 November 2026.
The README documents legacy and job output modes, R2 delivery, asset handling, and generated manifests.
YOUR NEXT CHALLENGE