# Blockstudio

> Build custom WordPress blocks, file-backed pages, reusable patterns, and extensions with JSON and PHP, Twig, or Blade.

## Pages
- [ACF Blocks](https://blockstudio.dev/compare/acf-blocks/): How Blockstudio compares to ACF Blocks: both render PHP from block.json. Blockstudio adds folder discovery, Twig, Blade, an asset pipeline, and is free.
- [AI](https://blockstudio.dev/ai/): Give coding agents a file-first WordPress framework with schemas, documentation, and predictable project context.
- [AI builders](https://blockstudio.dev/compare/ai-builders/): Lovable, Bolt, and v0 generate an app on their cloud. Blockstudio points your coding agent at real WordPress: files in git, client-editable, on any host.
- [Astro](https://blockstudio.dev/compare/astro/): How Blockstudio compares to Astro: static HTML from files once you turn on prerendering, plus the whole WordPress platform. Auth, a client editor, and plugins.
- [Blocks](https://blockstudio.dev/features/blocks/): Define fields in JSON and write custom WordPress block templates in PHP, Twig, or Blade without a JavaScript build step.
- [Bricks](https://blockstudio.dev/compare/bricks/): How Blockstudio compares to Bricks: markup you write in template files and keep in git, with clients in the block editor, not builder data in the database.
- [Compare](https://blockstudio.dev/compare/): How Blockstudio compares to ACF Blocks, create-block, GUI block builders, page builders, Elementor, Bricks, headless WordPress, Astro, and AI builders.
- [create-block](https://blockstudio.dev/compare/create-block/): How Blockstudio compares to @wordpress/create-block: the same block.json, with fields instead of a React edit component, server-rendered templates, no build.
- [Editor](https://blockstudio.dev/features/editor/): Field drawers, inserter previews, editor policies in blockstudio.json and an admin inventory for WordPress editors.
- [Elementor](https://blockstudio.dev/compare/elementor/): How Blockstudio compares to Elementor: your layout as template files in git and real blocks in WordPress, not JSON in post meta that only Elementor renders.
- [Extensions](https://blockstudio.dev/features/extensions/): Add custom fields, classes, styles, and data attributes to core, third-party, or custom WordPress blocks with JSON.
- [Full-Stack](https://blockstudio.dev/full-stack/): Build complete WordPress features with file-backed blocks, database tables, RPC endpoints, and managed infrastructure.
- [GUI block builders](https://blockstudio.dev/compare/block-builders/): How Blockstudio compares to Lazy Blocks, Genesis Custom Blocks, and MB Blocks: they offer an admin builder and a code path, Blockstudio starts from files.
- [Headless WordPress](https://blockstudio.dev/compare/headless-wordpress/): How Blockstudio compares to headless WordPress with Next.js or Faust.js: templates in files and static prerendering in one WordPress, plugins intact.
- [Home](https://blockstudio.dev/)
- [Imprint](https://blockstudio.dev/imprint/): Provider information for the websites of Dennis Josek.
- [Page builders](https://blockstudio.dev/compare/page-builders/): How Blockstudio compares to WordPress page builders: your layout in files, not builder data in the database. Git history, readable diffs, and review.
- [Pages](https://blockstudio.dev/features/pages/): Build complete WordPress pages and collections from version-controlled templates or Markdown while preserving native editor content.
- [Patterns](https://blockstudio.dev/features/patterns/): Register reusable, editable WordPress block patterns from version-controlled template files and JSON configuration.
- [PhantomStudio](https://blockstudio.dev/compare/phantomwp/): How Blockstudio compares to PhantomStudio, formerly PhantomWP: static HTML from inside WordPress once you turn on prerendering. One system, plugins that render.
- [Privacy Policy](https://blockstudio.dev/privacy/): How we process personal data on our websites, in the sleekwp.com shop and for Blockstudio Plus.
- [Production](https://blockstudio.dev/features/production/): Serve anonymous WordPress pages as prerendered HTML before WordPress boots, and switch on production defaults and stable image sizes from blockstudio.json.
- [Tailwind CSS](https://blockstudio.dev/features/tailwind/): Use Tailwind CSS v4 in WordPress without Node or a build step: Blockstudio compiles the classes each page uses in PHP and caches them by class set.
- [Terms](https://blockstudio.dev/terms/): Terms of use for our websites, terms of sale for sleekwp.com and the terms for Blockstudio Plus.

## Docs
- [Introduction](https://blockstudio.dev/docs.md): Welcome to the Blockstudio documentation.
- [Getting Started (Start / Setup)](https://blockstudio.dev/docs/general/getting-started.md): Set up your first Blockstudio project.
- [Settings](https://blockstudio.dev/docs/general/settings.md): Configure Blockstudio with blockstudio.json or filters.
- [Composer](https://blockstudio.dev/docs/dev/composer.md): Install Blockstudio using Composer.
- [Registration](https://blockstudio.dev/docs/blocks/registration.md): Learn how to register custom blocks with Blockstudio.
- [Translations](https://blockstudio.dev/docs/general/translations.md): Use Blockstudio in your language and help translate it.
- [Schema](https://blockstudio.dev/docs/blocks/schema.md): JSON Schema support for Blockstudio blocks.
- [Overrides](https://blockstudio.dev/docs/blocks/overrides.md): Override blocks on a granular level.
- [Twig](https://blockstudio.dev/docs/blocks/templating/twig.md): Use Twig templates for your Blockstudio blocks.
- [Blade](https://blockstudio.dev/docs/blocks/templating/blade.md): Use Laravel Blade templates for your Blockstudio blocks.
- [General (Blocks / Assets)](https://blockstudio.dev/docs/blocks/assets.md): Automatically enqueue and process CSS, SCSS, and JavaScript files for your blocks.
- [Registering Assets](https://blockstudio.dev/docs/blocks/assets/registering.md): Automatically enqueue CSS and JavaScript files for your blocks.
- [Processing Assets](https://blockstudio.dev/docs/blocks/assets/processing.md): Minification, SCSS compilation, and ES modules support.
- [Code Field Assets](https://blockstudio.dev/docs/blocks/assets/code-field.md): Dynamic asset blocks via the code field.
- [Registering Attributes](https://blockstudio.dev/docs/blocks/attributes/registering.md): Learn how to register custom attributes for your blocks.
- [Field Types](https://blockstudio.dev/docs/blocks/attributes/field-types.md): All available field types and their properties in Blockstudio.
- [Custom Field Types](https://blockstudio.dev/docs/blocks/attributes/custom-field-types.md): Register custom editor controls and structured attribute values.
- [Custom Fields](https://blockstudio.dev/docs/blocks/attributes/custom-fields.md): Reusable field definitions for Blockstudio blocks.
- [Block Field](https://blockstudio.dev/docs/blocks/attributes/block-field.md): Reference another block as a field, expanding its attributes inline.
- [Filtering Attributes](https://blockstudio.dev/docs/blocks/attributes/filtering.md): Filter and modify block attributes with PHP hooks.
- [Rendering Attributes](https://blockstudio.dev/docs/blocks/attributes/rendering.md): Access attribute values in your block templates.
- [Block Attributes](https://blockstudio.dev/docs/blocks/attributes/block-attributes.md): Access standard WordPress block attributes like alignment and typography.
- [HTML Utilities](https://blockstudio.dev/docs/blocks/attributes/html-utilities.md): Render attribute values as data attributes or CSS variables.
- [Storage](https://blockstudio.dev/docs/blocks/storage.md): Store field values in different locations like post meta or options.
- [Expanded Editor](https://blockstudio.dev/docs/blocks/attributes/expanded-editor.md): Edit Blockstudio fields in a wider drawer when the inspector sidebar is too narrow.
- [Conditional Logic](https://blockstudio.dev/docs/blocks/attributes/conditional-logic.md): Show or hide fields based on conditions.
- [Populating Options](https://blockstudio.dev/docs/blocks/attributes/populating-options.md): Dynamically populate field options from queries, functions, or external sources.
- [Disabling Attributes](https://blockstudio.dev/docs/blocks/attributes/disabling.md): Temporarily disable attributes while preserving their values.
- [General (Blocks / React Components)](https://blockstudio.dev/docs/blocks/react-components.md): Use React-powered editor components directly in your PHP, Twig, or Blade templates.
- [useBlockProps](https://blockstudio.dev/docs/blocks/react-components/useblockprops.md): Create markup parity between editor and frontend.
- [InnerBlocks](https://blockstudio.dev/docs/blocks/react-components/innerblocks.md): Allow nested blocks within your custom blocks.
- [RichText](https://blockstudio.dev/docs/blocks/react-components/richtext.md): Add editable text fields directly in your block templates.
- [MediaPlaceholder](https://blockstudio.dev/docs/blocks/react-components/mediaplaceholder.md): Add a media upload placeholder to your blocks.
- [Variations](https://blockstudio.dev/docs/blocks/variations.md): Create block variations with different default attribute values.
- [Transforms](https://blockstudio.dev/docs/blocks/transforms.md): Define ways to transform blocks into other blocks.
- [Preview](https://blockstudio.dev/docs/blocks/preview.md): Enable block previews in the block inserter.
- [Loading](https://blockstudio.dev/docs/blocks/loading.md): Control how blocks are loaded in the editor.
- [SEO](https://blockstudio.dev/docs/blocks/seo.md): How Blockstudio integrates with SEO plugins for real-time content analysis.
- [Environment](https://blockstudio.dev/docs/blocks/environment.md): Conditionally render content based on the rendering context.
- [Context](https://blockstudio.dev/docs/blocks/context.md): Access loop and post context data in your block templates.
- [Post Meta](https://blockstudio.dev/docs/blocks/post-meta.md): Access post meta data in your block templates.
- [Programmatic Rendering](https://blockstudio.dev/docs/blocks/rendering.md): Render Blockstudio blocks programmatically via PHP functions or HTML tags.
- [Components](https://blockstudio.dev/docs/blocks/components.md): Non-editor blocks for programmatic rendering.
- [UI Components](https://blockstudio.dev/docs/blocks/ui-components.md): The bundled bsui component library, the design system behind it, and how to theme it.
- [Islands](https://blockstudio.dev/docs/blocks/islands.md): Split blocks into cache-safe placeholders and client-rendered fragments.
- [Interactivity](https://blockstudio.dev/docs/blocks/interactivity.md): Use the WordPress Interactivity API in your blocks for reactive, client-side behavior.
- [Initialization](https://blockstudio.dev/docs/blocks/block-api/initialization.md): Execute code during WordPress initialization.
- [RPC](https://blockstudio.dev/docs/blocks/block-api/rpc.md): Call server-side PHP functions from the frontend with a lightweight RPC system inspired by tRPC.
- [Database](https://blockstudio.dev/docs/blocks/block-api/database.md): Define a data model for your block with automatic CRUD endpoints, validation, and multiple storage backends.
- [Cron](https://blockstudio.dev/docs/blocks/block-api/cron.md): Define scheduled background tasks per block using WordPress Cron.
- [PHP Hooks](https://blockstudio.dev/docs/blocks/hooks/php.md): PHP filters and actions available in Blockstudio.
- [JavaScript Hooks](https://blockstudio.dev/docs/blocks/hooks/javascript.md): JavaScript filters and actions available in Blockstudio.
- [General (Pages & Patterns / File Templates)](https://blockstudio.dev/docs/pages-and-patterns.md): Create WordPress pages and block patterns from file templates with automatic block parsing.
- [Pages (Pages & Patterns / File Templates)](https://blockstudio.dev/docs/pages-and-patterns/pages.md): Create WordPress pages from file templates with explicit, deployment-safe syncing.
- [Patterns (Pages & Patterns / File Templates)](https://blockstudio.dev/docs/pages-and-patterns/patterns.md): Create WordPress block patterns from file templates.
- [Site Templates](https://blockstudio.dev/docs/pages-and-patterns/site-templates.md): Create WordPress Site Editor templates and template parts from Blockstudio files.
- [Hooks](https://blockstudio.dev/docs/pages-and-patterns/template-hooks.md): PHP filters and actions for pages, patterns, Site Templates, and the HTML parser.
- [Content Sync](https://blockstudio.dev/docs/content-sync.md): Add database content to Blockstudio's file-first workflow by projecting allowlisted WordPress records to portable files.
- [Tailwind CSS (Blocks / Styling)](https://blockstudio.dev/docs/tailwind.md): Server-side Tailwind CSS compilation with automatic caching.
- [Extensions (Blocks / Project Files)](https://blockstudio.dev/docs/extensions.md): Extend any registered block with custom attributes.
- [Performance](https://blockstudio.dev/docs/production/performance.md): Production frontend defaults, the built-in profiler, and the render techniques underneath.
- [Static Prerendering](https://blockstudio.dev/docs/production/static-prerendering.md): Serve anonymous pages as static HTML, optionally before WordPress boots.
- [Caching](https://blockstudio.dev/docs/production/caching.md): The one file-backed cache directory that owns every generated runtime artifact.
- [Media](https://blockstudio.dev/docs/production/media.md): Stable image dimensions, lazy loading, and the media metadata manifest.
- [Code Snippets](https://blockstudio.dev/docs/code-snippets.md): Use Blockstudio's file-first approach for code snippets.
- [Admin](https://blockstudio.dev/docs/dev/admin.md): Inspect registered Blockstudio blocks, browse registries, and view database records from wp-admin.
- [Canvas](https://blockstudio.dev/docs/dev/canvas.md): A visual workspace and public inventory API for Blockstudio content.
- [Element Grabber](https://blockstudio.dev/docs/dev/grab.md): A built-in element inspector for identifying block template files on the frontend.
- [CLI](https://blockstudio.dev/docs/dev/cli.md): Manage Blockstudio blocks, pages, database, RPC, and cron from the command line via WP-CLI.
- [PHPStan](https://blockstudio.dev/docs/dev/phpstan.md): Static analysis for Blockstudio projects with type-safe templates, schema validation, and hook checking.
- [AI Integration](https://blockstudio.dev/docs/dev/ai.md): An addressable documentation index for coding agents, plus a generated contract for your own project.
- [Logical Discovery Sources](https://blockstudio.dev/docs/dev/discovery-sources.md): Supply composed file inventories to Blockstudio discovery and runtime caches.
- [WPML](https://blockstudio.dev/docs/dev/wpml.md): Generate the WPML language configuration that makes the text fields of Blockstudio blocks translatable.
- [Migrating to v7](https://blockstudio.dev/docs/dev/migration/v7.md): Breaking changes and migration steps for Blockstudio 7.

## Guides
- [Guides](https://blockstudio.dev/guides.md): In-depth guides for building with Blockstudio.
- [Vibecoding with Blockstudio](https://blockstudio.dev/guides/vibecoding.md): How to build WordPress blocks, pages, and full sites using AI coding agents. Practical patterns for getting the most out of Blockstudio's file-based architecture.
- [Migrating from ACF Blocks](https://blockstudio.dev/guides/migrating-from-acf.md): A practical guide for moving your custom blocks from Advanced Custom Fields to Blockstudio. Side-by-side comparisons, field mappings, and step-by-step migration patterns.
- [Building Interactive Components](https://blockstudio.dev/guides/interactive-components.md): Build accordions, tabs, modals, and like buttons with the WordPress Interactivity API. Complete examples with no build step required.
- [Building File-Based Pages](https://blockstudio.dev/guides/file-based-pages.md): Create WordPress pages from code. A practical guide to template locking, block editing modes, keyed merging, and controlling exactly what clients can edit.
- [Block Context and Communication](https://blockstudio.dev/guides/block-context.md): Pass data between parent and child blocks. Build section wrappers, card grids, pricing tables, and other component patterns where blocks need to talk to each other.
- [Field Patterns Cookbook](https://blockstudio.dev/guides/field-patterns.md): Practical recipes for common field combinations. Conditional groups, smart selects, rich repeaters, organized settings, media patterns, queryable storage, and reusable field definitions.
- [Building a Block Library](https://blockstudio.dev/guides/block-library.md): Build a complete set of section blocks with Tailwind CSS. Project setup, design tokens, the section pattern, repeaters, images, and page composition.
- [Full-Stack Blocks](https://blockstudio.dev/guides/full-stack-blocks.md): Build complete applications as blocks with database, RPC, cron, and the Interactivity API.
- [Composing Templates with Block Tags](https://blockstudio.dev/guides/block-tags.md): Write blocks as HTML tags inside templates and page sources, add project prefixes for shorter names, and migrate shorthands back to the portable canonical spelling.
- [Building a Documentation Site](https://blockstudio.dev/guides/documentation-site.md): Build a documentation section from Markdown files with a page collection, its own post type and URL base, a loader for generated pages, and a layout with sidebar navigation.
- [Site Editor Templates and Parts from Files](https://blockstudio.dev/guides/site-editor-templates.md): Author block theme templates and template parts as Blockstudio folders with a manifest and HTML-like markup, compiled to native block markup while the Site Editor keeps its customize and reset workflow.
- [Building an App Screen with the Bundled UI](https://blockstudio.dev/guides/ui-app-screen.md): Build a working CRUD screen from one block folder with the bundled bsui components, a db.php data model, an RPC action, and an Interactivity API store.
- [Building a Custom Field Type](https://blockstudio.dev/guides/custom-field-types.md): Register a namespaced editor control with a structured value, store it in post meta with a REST schema, and use it inside repeaters and templates like a built-in field.
- [Moving Database Content into Files with Content Sync](https://blockstudio.dev/guides/content-sync.md): Pull selected posts, terms, and metadata into portable files, review them in git, and push them to another environment with stable IDs, declared references, and safe pruning.
- [Checked Templates with PHPStan and a Generated AGENTS.md](https://blockstudio.dev/guides/analysis-and-agents.md): Catch missing fields and unescaped output before they ship, gate commits on the result, and give coding agents a contract generated from your own project.
- [Serving WordPress as Static HTML](https://blockstudio.dev/guides/static-prerendering.md): Turn on Blockstudio's static prerender, verify what it caches, keep logged-in markup safe, and put a CDN in front of it.
- [Personalized Fragments on Cached Pages](https://blockstudio.dev/guides/block-islands.md): Keep pages fully cached and still greet signed-in visitors or show a live cart count, using dynamic block islands and their signed fragment endpoint.
- [Deploying a Blockstudio Site](https://blockstudio.dev/guides/deploying.md): Ship a Blockstudio theme from CI. Install Composer dependencies, reconcile file-backed pages with a JSON report, refresh the static cache, and know which maintenance commands belong in a release.
- [Publishing a Block Registry on GitHub](https://blockstudio.dev/guides/block-registry.md): Share blocks across projects from a GitHub repository. Structure the repo, write registry.json, serve it through raw URLs, and install blocks with the registry CLI.

## Registry
- [General (Introduction)](https://blockstudio.dev/registry.md): A shadcn-style CLI for WordPress blocks. No packages, no builds. Just source code copied into your project.
- [Getting Started (Introduction)](https://blockstudio.dev/registry/getting-started.md): Set up the Blockstudio Registry CLI in your project and install your first block.
- [init](https://blockstudio.dev/registry/cli/init.md): Create a blocks.json config file in your project.
- [add](https://blockstudio.dev/registry/cli/add.md): Add blocks from a registry to your project.
- [list](https://blockstudio.dev/registry/cli/list.md): List available blocks from your configured registries.
- [search](https://blockstudio.dev/registry/cli/search.md): Search for blocks across all configured registries.
- [remove](https://blockstudio.dev/registry/cli/remove.md): Remove an installed block from your project.
- [blocks.json](https://blockstudio.dev/registry/configuration/blocks-json.md): The project config file that tells the CLI where to install blocks and which registries to use.
- [registry.json](https://blockstudio.dev/registry/configuration/registry-json.md): The registry manifest that block authors publish to make their blocks available.
- [Hosting a Registry](https://blockstudio.dev/registry/hosting.md): How to publish your own block registry for others to use.
- [GitHub](https://blockstudio.dev/registry/hosting/github.md): Host a block registry directly from a GitHub repository.
- [Custom Server](https://blockstudio.dev/registry/hosting/custom-server.md): Serve a block registry from your own infrastructure.
- [blocks.json Schema](https://blockstudio.dev/registry/reference/blocks-json-schema.md): Complete field reference for the blocks.json project config file.
- [registry.json Schema](https://blockstudio.dev/registry/reference/registry-json-schema.md): Complete field reference for the registry.json manifest file.

## Blog
- [Blog](https://blockstudio.dev/blog/): News and updates from the Blockstudio team.
- [Blockstudio 7.7](https://blockstudio.dev/blog/blockstudio-7-7.md): Virtual routes, targeted prerender builds, better editor behavior, and more reliable file-based content.
- [Blockstudio 7.6](https://blockstudio.dev/blog/blockstudio-7-6.md): Ask a project what it contains, render any part of it on demand, and move production behaviour into blockstudio.json.
- [Blockstudio 7.5](https://blockstudio.dev/blog/blockstudio-7-5.md): Custom field types, file-backed Site Editor templates, block islands, logical discovery sources, Storh storage, and faster warm rendering.
- [Blockstudio 7.4](https://blockstudio.dev/blog/blockstudio-7-4.md): Page collections, Markdown page sources, Content Sync, block tag prefixes, and runtime and editor fixes.
- [Blockstudio 7.3](https://blockstudio.dev/blog/blockstudio-7-3.md): Bundled UI components, expanded editing, plugin dependencies, editor policies, and a more reliable parsing pipeline.
- [Blockstudio 7.2](https://blockstudio.dev/blog/blockstudio-7-2.md): An admin overview, a registry CLI for distributing blocks, a PHPStan extension for type-safe templates, and SCSS preludes.
- [Blockstudio 7.1](https://blockstudio.dev/blog/blockstudio-7-1.md): RPC, database, cron, components, and more new features turning blocks into full-stack applications.
- [Introducing Blockstudio 7](https://blockstudio.dev/blog/introducing-blockstudio-7.md): A complete rewrite of the WordPress block framework. Now free and open source, with file-based pages, an HTML-to-block parser, and an architecture built for AI coding agents.

## Optional
- [Full documentation](https://blockstudio.dev/llms-full.txt): Markdown source of every documentation page in one file, 996 KB, about 255,000 tokens
- [Docs index](https://blockstudio.dev/docs/llms.txt): Every page under /docs/ by section, with its Markdown URL
- [Docs in one file](https://blockstudio.dev/docs/llms-full.txt): Markdown source of every page under /docs/, 642 KB, about 164,000 tokens
- [Guides index](https://blockstudio.dev/guides/llms.txt): Every page under /guides/ by section, with its Markdown URL
- [Guides in one file](https://blockstudio.dev/guides/llms-full.txt): Markdown source of every page under /guides/, 321 KB, about 82,000 tokens
- [Registry index](https://blockstudio.dev/registry/llms.txt): Every page under /registry/ by section, with its Markdown URL
- [Registry in one file](https://blockstudio.dev/registry/llms-full.txt): Markdown source of every page under /registry/, 33 KB, about 8,600 tokens
- [Blockstudio context index for coding agents](https://blockstudio.dev/blockstudio-llm.txt): Shipped with the Blockstudio package: every document of the docs, guides, registry and schemas with its route, source file, purpose and the settings, hooks, PHP symbols and CLI commands it owns, 43 KB, about 11,000 tokens
- [Blockstudio documentation and schemas in one file](https://blockstudio.dev/blockstudio-llm-full.txt): Shipped with the Blockstudio package: the full text of every document plus the JSON schemas, which llms-full.txt leaves out, 642 KB, about 164,000 tokens