# wordpress/create-block-theme architecture

> Architecture diagram of the GitHub repository wordpress/create-block-theme, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/wordpress/create-block-theme
- Repository: https://github.com/wordpress/create-block-theme

## Overview

Create Block Theme is a WordPress plugin that adds theme-management workflows to the Site Editor and admin dashboard. Users choose an operation in the UI; the editor client calls the plugin API, which creates or updates theme files and can prepare an export ZIP. The README also documents template localization, image collection, style and font saving, metadata editing, variations, and theme reset. The graph reflects those documented capabilities and sampled call sites; several PHP implementation details were not sampled, so uncertain internal wiring is omitted.

Main entry points: [`includes/class-create-block-theme-api.php`](https://github.com/wordpress/create-block-theme/blob/trunk/includes/class-create-block-theme-api.php) (Theme REST API), [`includes/create-theme/theme-templates.php`](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-templates.php) (Template processing), [`src/resolvers.js`](https://github.com/wordpress/create-block-theme/blob/trunk/src/resolvers.js) (API resolvers), [`src/plugin-sidebar.js`](https://github.com/wordpress/create-block-theme/blob/trunk/src/plugin-sidebar.js) (Editor sidebar)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_editor["Editor experience"]
  node_sidebar["Editor sidebar<br/>[plugin-sidebar.js]"]
  node_savepanel["Save panel<br/>[save-panel.js]"]
  node_metadata["Metadata editor"]
  node_typography["Typography controls"]
  node_resolvers["API resolvers<br/>[resolvers.js]"]
  node_download["File download<br/>[download-file.js]"]
  node_fontcredits["Font credits<br/>[fonts.js]"]
  node_fontparser["Font parser"]
end

subgraph group_api["Theme operations"]
  node_api["Theme REST API"]
  node_create["Theme creation<br/>[theme-create.php]"]
  node_settings["Theme settings save"]
  node_fonts["Font saving<br/>[theme-fonts.php]"]
end

subgraph group_processing["Export processing"]
  node_styles["Style processing<br/>[theme-styles.php]"]
  node_templates["Template processing"]
  node_patterns["Pattern processing<br/>[theme-patterns.php]"]
  node_media["Media localization<br/>[theme-media.php]"]
  node_locale["Text localization<br/>[theme-locale.php]"]
  node_themejson["Theme JSON<br/>[theme-json.php]"]
  node_zip["Theme ZIP<br/>[theme-zip.php]"]
  node_archive["ZIP archive"]
end

subgraph group_admin["Admin experience"]
  node_landing["Admin landing page<br/>[landing-page.js]"]
end

node_developer(("Theme developer"))
node_wpeditor(("WordPress Editor"))
node_wordpress["WordPress services"]
node_themefiles["Theme files"]

node_developer -->|"uses"| node_wpeditor
node_wpeditor -->|"opens"| node_sidebar
node_developer -->|"opens"| node_landing
node_sidebar -->|"navigates to"| node_savepanel
node_sidebar -->|"requests export"| node_resolvers
node_landing -->|"requests export"| node_resolvers
node_resolvers -->|"calls endpoints"| node_api
node_sidebar -->|"downloads response"| node_download
node_landing -->|"downloads response"| node_download
node_savepanel -->|"submits operations"| node_resolvers
node_metadata -->|"reads theme data"| node_wordpress
node_metadata -->|"gets font credits"| node_fontcredits
node_fontcredits -->|"gets font families"| node_resolvers
node_fontcredits -->|"parses font files"| node_fontparser
node_fontcredits -->|"fetches font files"| node_wordpress
node_typography -->|"filters block settings"| node_wpeditor
node_api -->|"creates themes"| node_create
node_api -->|"saves changes"| node_settings
node_api -->|"builds export"| node_zip
node_api -->|"exports templates"| node_templates
node_api -->|"exports theme data"| node_themejson
node_zip -->|"writes archive"| node_archive
node_zip -->|"copies theme files"| node_themefiles
node_api -->|"saves fonts"| node_fonts
node_settings -->|"saves styles"| node_styles
node_settings -->|"saves templates"| node_templates
node_settings -->|"updates theme"| node_themefiles
node_templates -->|"localizes images"| node_media
node_templates -->|"localizes text"| node_locale
node_templates -->|"processes patterns"| node_patterns
node_themejson -->|"writes theme JSON"| node_themefiles
node_create -->|"creates theme files"| node_themefiles
node_fonts -->|"writes font assets"| node_themefiles

click node_sidebar "https://github.com/wordpress/create-block-theme/blob/trunk/src/plugin-sidebar.js"
click node_savepanel "https://github.com/wordpress/create-block-theme/blob/trunk/src/editor-sidebar/save-panel.js"
click node_landing "https://github.com/wordpress/create-block-theme/blob/trunk/src/landing-page/landing-page.js"
click node_metadata "https://github.com/wordpress/create-block-theme/blob/trunk/src/editor-sidebar/metadata-editor-modal.js"
click node_typography "https://github.com/wordpress/create-block-theme/blob/trunk/src/editor-enhancements/expand-typography-controls.js"
click node_resolvers "https://github.com/wordpress/create-block-theme/blob/trunk/src/resolvers.js"
click node_download "https://github.com/wordpress/create-block-theme/blob/trunk/src/utils/download-file.js"
click node_api "https://github.com/wordpress/create-block-theme/blob/trunk/includes/class-create-block-theme-api.php"
click node_create "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-create.php"
click node_settings "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-settings-save.php"
click node_fonts "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-fonts.php"
click node_styles "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-styles.php"
click node_templates "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-templates.php"
click node_patterns "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-patterns.php"
click node_media "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-media.php"
click node_locale "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-locale.php"
click node_themejson "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-json.php"
click node_zip "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-zip.php"
click node_archive "https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/cbt-zip-archive.php"
click node_fontcredits "https://github.com/wordpress/create-block-theme/blob/trunk/src/utils/fonts.js"
click node_fontparser "https://github.com/wordpress/create-block-theme/blob/trunk/src/lib/lib-font/lib-font.browser.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_sidebar,node_savepanel,node_metadata,node_typography,node_resolvers,node_download,node_fontcredits,node_fontparser toneBlue
class node_api,node_create,node_settings,node_fonts toneAmber
class node_styles,node_templates,node_patterns,node_media,node_locale,node_themejson,node_zip,node_archive toneMint
class node_landing toneRose
class node_developer,node_wpeditor,node_wordpress,node_themefiles toneIndigo
```

## Components

### Editor experience

- [Editor sidebar](https://github.com/wordpress/create-block-theme/blob/trunk/src/plugin-sidebar.js): `src/plugin-sidebar.js`
- [Save panel](https://github.com/wordpress/create-block-theme/blob/trunk/src/editor-sidebar/save-panel.js): `src/editor-sidebar/save-panel.js`
- [Metadata editor](https://github.com/wordpress/create-block-theme/blob/trunk/src/editor-sidebar/metadata-editor-modal.js): `src/editor-sidebar/metadata-editor-modal.js`
- [Typography controls](https://github.com/wordpress/create-block-theme/blob/trunk/src/editor-enhancements/expand-typography-controls.js): `src/editor-enhancements/expand-typography-controls.js`
- [API resolvers](https://github.com/wordpress/create-block-theme/blob/trunk/src/resolvers.js): `src/resolvers.js`
- [File download](https://github.com/wordpress/create-block-theme/blob/trunk/src/utils/download-file.js): `src/utils/download-file.js`
- [Font credits](https://github.com/wordpress/create-block-theme/blob/trunk/src/utils/fonts.js): `src/utils/fonts.js`
- [Font parser](https://github.com/wordpress/create-block-theme/blob/trunk/src/lib/lib-font/lib-font.browser.js): `src/lib/lib-font/lib-font.browser.js`

### Theme operations

- [Theme REST API](https://github.com/wordpress/create-block-theme/blob/trunk/includes/class-create-block-theme-api.php): `includes/class-create-block-theme-api.php`
- [Theme creation](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-create.php): `includes/create-theme/theme-create.php`
- [Theme settings save](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-settings-save.php): `includes/create-theme/theme-settings-save.php`
- [Font saving](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-fonts.php): `includes/create-theme/theme-fonts.php`

### Export processing

- [Style processing](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-styles.php): `includes/create-theme/theme-styles.php`
- [Template processing](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-templates.php): `includes/create-theme/theme-templates.php`
- [Pattern processing](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-patterns.php): `includes/create-theme/theme-patterns.php`
- [Media localization](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-media.php): `includes/create-theme/theme-media.php`
- [Text localization](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-locale.php): `includes/create-theme/theme-locale.php`
- [Theme JSON](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-json.php): `includes/create-theme/theme-json.php`
- [Theme ZIP](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/theme-zip.php): `includes/create-theme/theme-zip.php`
- [ZIP archive](https://github.com/wordpress/create-block-theme/blob/trunk/includes/create-theme/cbt-zip-archive.php): `includes/create-theme/cbt-zip-archive.php`

### Admin experience

- [Admin landing page](https://github.com/wordpress/create-block-theme/blob/trunk/src/landing-page/landing-page.js): `src/landing-page/landing-page.js`

### Other components

- **Theme developer**
- **WordPress Editor**
- **WordPress services**
- **Theme files**

## Connections

- Theme developer → WordPress Editor: uses
- WordPress Editor → Editor sidebar: opens
- Theme developer → Admin landing page: opens
- Editor sidebar → Save panel: navigates to
- Editor sidebar → API resolvers: requests export
- Admin landing page → API resolvers: requests export
- API resolvers → Theme REST API: calls endpoints
- Editor sidebar → File download: downloads response
- Admin landing page → File download: downloads response
- Save panel → API resolvers: submits operations
- Metadata editor → WordPress services: reads theme data
- Metadata editor → Font credits: gets font credits
- Font credits → API resolvers: gets font families
- Font credits → Font parser: parses font files
- Font credits → WordPress services: fetches font files
- Typography controls → WordPress Editor: filters block settings
- Theme REST API → Theme creation: creates themes
- Theme REST API → Theme settings save: saves changes
- Theme REST API → Theme ZIP: builds export
- Theme REST API → Template processing: exports templates
- Theme REST API → Theme JSON: exports theme data
- Theme ZIP → ZIP archive: writes archive
- Theme ZIP → Theme files: copies theme files
- Theme REST API → Font saving: saves fonts
- Theme settings save → Style processing: saves styles
- Theme settings save → Template processing: saves templates
- Theme settings save → Theme files: updates theme
- Template processing → Media localization: localizes images
- Template processing → Text localization: localizes text
- Template processing → Pattern processing: processes patterns
- Theme JSON → Theme files: writes theme JSON
- Theme creation → Theme files: creates theme files
- Font saving → Theme files: writes font assets
