Full Site Editing landed in WordPress 5.9. Three years later, most agencies still aren't using it properly — and the ones that are have a serious competitive advantage.

What FSE actually means

Before FSE, WordPress themes controlled headers, footers, and global layout through PHP templates. Gutenberg handled only the content area. You could edit your blog post with blocks, but your navigation was locked in a PHP file.

FSE changes that. With a block theme, every part of the site — header, footer, sidebar, archive templates, single post layout — is editable in the Gutenberg editor using blocks. No PHP required for layout changes.

This matters for AI generation because it means the entire site can be expressed as block JSON. There's no hybrid system where some parts are PHP templates and some are blocks. Everything is blocks, everything is JSON, everything can be generated and edited programmatically.

How NoDevZone uses FSE

When NoDevZone generates a site, it doesn't just create a homepage. It creates a complete block theme with:

  • templates/index.html — the default template
  • templates/single.html — single post layout
  • templates/archive.html — blog/category listing
  • templates/404.html — error page
  • parts/header.html — reusable header block
  • parts/footer.html — reusable footer block
  • theme.json — global styles (colors, typography, spacing)

All of these are generated from the same Design Mandate. The color palette defined for the homepage is the same one used in the theme.json global styles. The font trio chosen for the hero is the same one loaded in the block theme's stylesheet.

This is the key advantage of FSE for AI generation: consistency is enforced by the system, not by hoping the designer remembered to apply the same font everywhere.

theme.json — the most important file you've never edited

theme.json is a configuration file that defines the global design system for a block theme. It controls:

  • Color palette — named colors that appear in the editor color picker
  • Typography — font families, sizes, line heights
  • Spacing — the spacing scale used by padding and margin controls
  • Border radius — default corner radius values
  • Layout — content width, wide width

When NoDevZone generates a site, the theme.json is built programmatically from the Design Mandate. The ink, bg1, bg2, and accent colors are registered as named palette colors. The font trio is registered as font families with the correct Google Fonts @import URLs.

The result is that when a client opens the Gutenberg editor to change text, the color picker shows exactly the four brand colors — nothing else. The font selector shows the three chosen fonts. The spacing controls use the system scale. The design system is enforced at the editor level.

What "edit live in Gutenberg" actually means

Every site generated by NoDevZone is a live WordPress install with Gutenberg FSE active. The client can:

  • Click any text and edit it directly
  • Change section backgrounds by clicking and selecting from the brand color palette
  • Reorder sections by dragging blocks
  • Add new sections from the block inserter
  • Change images by clicking the placeholder

They cannot accidentally break the design system by picking an off-brand color, because the only colors available are the four brand colors. They cannot choose a mismatched font, because only the three brand fonts are registered.

This is what makes AI-generated sites practical for real clients — the constraints that make the design work are preserved after handoff.

The block coverage problem

FSE is powerful, but it has a coverage problem. Not every design pattern can be expressed cleanly in core Gutenberg blocks. Complex layouts, interactive components, and custom data displays often require custom blocks or third-party plugins.

NoDevZone handles this in two ways:

For layout: we use a combination of Group, Cover, Columns, and Media & Text blocks with carefully controlled attributes. About 95% of marketing page layouts can be achieved with these four block types alone.

For interactive components: the Plugin Builder generates custom Gutenberg blocks as PHP plugins. A pricing table, a booking form, a testimonial slider — these are generated as proper registered blocks that integrate with the FSE editor, not shortcodes bolted onto the side.

The goal is that everything a client needs to edit is editable in the visual editor, without touching code.