PHPackages friendsoftypo3/content-blocks-gui - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Admin Panels](/categories/admin) 4. / 5. friendsoftypo3/content-blocks-gui ActiveTypo3-cms-extension[Admin Panels](/categories/admin) friendsoftypo3/content-blocks-gui ================================= Visual backend module for creating and editing Content Blocks definitions. 0.3.0(2mo ago)12181↑27.3%5[5 issues](https://github.com/FriendsOfTYPO3/content-blocks-gui/issues)GPL-2.0-or-laterTypeScript Since Mar 31Pushed 2mo ago3 watchersCompare [ Source](https://github.com/FriendsOfTYPO3/content-blocks-gui)[ Packagist](https://packagist.org/packages/friendsoftypo3/content-blocks-gui)[ Docs](https://github.com/FriendsOfTYPO3/content-blocks-gui)[ RSS](/packages/friendsoftypo3-content-blocks-gui/feed)WikiDiscussions main Synced 4w ago READMEChangelog (5)Dependencies (24)Versions (7)Used By (0) [![TYPO3 compatibility](https://camo.githubusercontent.com/fc47d6edb7035908e2db102ae2c05d22110b6681c21fe7ed9677bc454dbad775/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f5459504f332d31332e342d6666383730303f6d61784167653d33363030266c6f676f3d7479706f33)](https://get.typo3.org/) TYPO3 Content Blocks GUI ======================== [](#typo3-content-blocks-gui) > **Alpha state**: This extension may contain bugs and can potentially break your TYPO3 installation. **Do not install on production systems.** Use only in development environments. The Content Blocks GUI provides a visual backend module for creating and editing [Content Blocks](https://github.com/friendsoftypo3/content-blocks) definitions. It serves as a kickstarter and YAML editor for the Content Blocks extension, allowing integrators to build Content Elements, Page Types, Record Types, and Basics through a drag-and-drop interface instead of writing YAML by hand. URL**Repository:****TER:**[https://extensions.typo3.org/extension/content\_blocks\_gui](https://extensions.typo3.org/extension/content_blocks_gui)**Content Blocks:****Content Blocks Docs:**Features -------- [](#features) **Visual Editor** - Three-pane drag-and-drop editor for composing Content Block field definitions - Left pane with settings, field component library, and Basics management - Middle pane for visual field arrangement with nested field support (Collections, Palettes) - Right pane with field-specific property configuration (value pickers, ranges, sliders, items, allowed types) - Base field auto-detection for `tt_content` and `pages` columns - Field validation and system reserved field detection **Content Type Support** - Content Elements (custom CType, grouping, icons, field prefixing) - Page Types (custom doktype values) - Record Types (custom tables and type fields) - Basics / Field Mixins (reusable field collections with circular dependency detection) **List View** - Tabbed overview with counters for each content type - Search, multi-column sorting, and usage reference counts - Create, edit, duplicate, and delete Content Blocks - Multi-select mode for batch operations **Import and Export** - Download individual or multiple Content Blocks as ZIP archives - Multi-step upload wizard with conflict detection and resolution - Preserves directory structure and language files **Administration** - Automatic cache clearing after save and import operations - Extension-aware storage (choose target extension for new blocks) Compatibility ------------- [](#compatibility) Extension versionTYPO3 versionPHP version0.2.x (alpha)13.48.2+Requirements ------------ [](#requirements) This extension requires the Content Blocks extension: - [friendsoftypo3/content-blocks](https://packagist.org/packages/friendsoftypo3/content-blocks) (^1.3) Installation ------------ [](#installation) Require this package via Composer: ``` composer require --dev friendsoftypo3/content-blocks-gui ``` Or install it via the Extension Manager in the TYPO3 backend. The extension key is `content_blocks_gui`. **Important:** The GUI looks for extensions that require `friendsoftypo3/content-blocks`in their `composer.json` to use as storage destination for new Content Blocks. Make sure your sitepackage or target extension has this dependency, then run `composer update` to refresh the package metadata. Otherwise the extension dropdown in the editor will be empty. After installation, the module is available in the TYPO3 backend under **Admin Tools > Content Blocks**. Developing ---------- [](#developing) There is a DDEV setup ready to use. Ensure [DDEV](https://github.com/ddev/ddev)is installed on your machine. Then run: ``` ddev start ddev composer install touch .Build/public/FIRST_INSTALL ddev launch ``` Continue with the TYPO3 installation process. ### Building JavaScript [](#building-javascript) The frontend is built with TypeScript and Lit. The build runs inside the DDEV container, no local Node.js installation needed: ``` ddev javascript ``` This compiles TypeScript, runs ESLint with auto-fix, and post-processes the output (import rewriting, minification) to `Resources/Public/JavaScript/content-blocks-gui/`. TypeScript sources are in `Build/Sources/TypeScript/friendsoftypo3/content-blocks-gui/`. ### TYPO3 Core TypeScript Files [](#typo3-core-typescript-files) The `Build/Sources/TypeScript/backend/` and `Build/Sources/TypeScript/core/` directories contain TypeScript files from the TYPO3 core, needed for type resolution during compilation. These are committed to the repo and rarely need updating. See [Build/TYPO3\_CORE\_TYPESCRIPT\_SYNC.md](Build/TYPO3_CORE_TYPESCRIPT_SYNC.md) for details on how to sync them when upgrading TYPO3 versions. Testing ------- [](#testing) Run the test suites via DDEV custom commands: ``` ddev test-unit # PHPUnit unit tests ddev test-functional # PHPUnit functional tests (uses the ddev db) ddev test-playwright # Playwright E2E tests (installs deps on first run) ``` Extra arguments are forwarded directly to the underlying runner, e.g. `ddev test-unit --filter MyTest` or `ddev test-playwright --ui`. Do **not**prefix them with `--`: PHPUnit treats `--` as "the rest are test file paths", so `ddev test-unit -- --filter MyTest` would make PHPUnit look for a file named `--filter`. On the first run, `ddev test-playwright` installs its npm dependencies and the chromium browser binary into `Tests/Playwright/`. If chromium fails to launch due to missing system libraries, add them via `webimage_extra_packages` in `.ddev/config.yaml`. ### PHPStan [](#phpstan) ``` ddev exec .Build/bin/phpstan analyse -c Build/phpstan/phpstan.neon ``` ### PHP-CS-Fixer [](#php-cs-fixer) ``` ddev exec .Build/bin/php-cs-fixer fix --config=Build/php-cs-fixer/config.php --dry-run --diff ``` ### Playwright E2E Tests [](#playwright-e2e-tests) See `Tests/Playwright/` for setup instructions. Feedback and Support -------------------- [](#feedback-and-support) You can reach us on the [TYPO3 Slack](https://typo3.org/community/meet/chat-slack)channel `#cig-structuredcontent`. We appreciate any constructive feedback and will help you, if you have any problems. License ------- [](#license) This project is licensed under GPL-2.0-or-later. ### Health Score 38 — LowBetter than 83% of packages Maintenance78 Regular maintenance activity Popularity24 Limited adoption so far Community17 Small or concentrated contributor base Maturity28 Early-stage or recently created project Bus Factor1 Top contributor holds 92.5% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~5 days Total 5 Last Release 71d ago ### Community Maintainers ![](https://avatars.githubusercontent.com/u/165630?v=4)[Benni Mack](/maintainers/bmack)[@bmack](https://github.com/bmack) ![](https://www.gravatar.com/avatar/4cfa2947b747549a4a243bb85545139173cc6822551468c9aed931baeb8bc0bc?d=identicon)[friendsoftypo3](/maintainers/friendsoftypo3) --- Top Contributors [![krausandre](https://avatars.githubusercontent.com/u/42275455?v=4)](https://github.com/krausandre "krausandre (37 commits)")[![jonaseberle](https://avatars.githubusercontent.com/u/1678001?v=4)](https://github.com/jonaseberle "jonaseberle (1 commits)")[![Kanti](https://avatars.githubusercontent.com/u/471387?v=4)](https://github.com/Kanti "Kanti (1 commits)")[![passionweb-manuel-schnabel](https://avatars.githubusercontent.com/u/120183093?v=4)](https://github.com/passionweb-manuel-schnabel "passionweb-manuel-schnabel (1 commits)") ### Code Quality TestsPHPUnit Static AnalysisPHPStan Code StylePHP CS Fixer Type Coverage Yes ### Embed Badge ![Health badge](/badges/friendsoftypo3-content-blocks-gui/health.svg) ``` [![Health](https://phpackages.com/badges/friendsoftypo3-content-blocks-gui/health.svg)](https://phpackages.com/packages/friendsoftypo3-content-blocks-gui) ``` ### Alternatives [friendsoftypo3/content-blocks TYPO3 CMS Content Blocks - Content Types API | Define reusable components via YAML 101466.4k45](/packages/friendsoftypo3-content-blocks)[wazum/sluggi TYPO3 extension for URL slug management with inline editing, auto-sync, locking, access control, and redirects 41515.2k](/packages/wazum-sluggi)[typo3/cms-adminpanel TYPO3 CMS Admin Panel - The Admin Panel displays information about your site in the frontend and contains a range of metrics including debug and caching information. 115.6M60](/packages/typo3-cms-adminpanel)[netresearch/rte-ckeditor-image Image support in CKEditor for the TYPO3 ecosystem - by Netresearch 611.0M7](/packages/netresearch-rte-ckeditor-image)[pagemachine/typo3-formlog Form log for TYPO3 23233.9k8](/packages/pagemachine-typo3-formlog)[typo3/cms-info TYPO3 CMS Info - TYPO3 backend module for displaying information, such as a pagetree overview and localization information. 168.9M133](/packages/typo3-cms-info) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)