pixelcoda / typo3-fe-editing
Production-ready TYPO3 frontend editing with inline editing, drag-and-drop, contextual records, headless support, accessibility and optional AI.
Package info
github.com/CasianBlanaru/pixelcoda-typo3-fe-editing
Type:project
pkg:composer/pixelcoda/typo3-fe-editing
Requires
- bk2k/bootstrap-package: ^15.0
- pixelcoda/fe-editor: dev-master
- pixelcoda/fe-editor-sitepackage: dev-master
- typo3/cms-backend: ^13.4
- typo3/cms-belog: ^13.4
- typo3/cms-beuser: ^13.4
- typo3/cms-core: ^13.4
- typo3/cms-dashboard: ^13.4
- typo3/cms-extbase: ^13.4
- typo3/cms-extensionmanager: ^13.4
- typo3/cms-felogin: ^13.4
- typo3/cms-filelist: ^13.4
- typo3/cms-fluid: ^13.4
- typo3/cms-fluid-styled-content: ^13.4
- typo3/cms-form: ^13.4
- typo3/cms-frontend: ^13.4
- typo3/cms-impexp: ^13.4
- typo3/cms-info: ^13.4
- typo3/cms-install: ^13.4
- typo3/cms-reactions: ^13.4
- typo3/cms-recycler: ^13.4
- typo3/cms-rte-ckeditor: ^13.4
- typo3/cms-seo: ^13.4
- typo3/cms-setup: ^13.4
- typo3/cms-sys-note: ^13.4
- typo3/cms-tstemplate: ^13.4
- typo3/cms-viewpage: ^13.4
- typo3/cms-webhooks: ^13.4
Requires (Dev)
None
Suggests
None
Provides
None
Conflicts
None
Replaces
None
README
Accessible, premium frontend editing for TYPO3 12 LTS, TYPO3 13 LTS and TYPO3 14.
Edit TYPO3 content directly on the rendered website with inline text editing, drag-and-drop sorting, contextual FormEngine records, image editing, headless-ready markers and an optional AI writing assistant.
Stable release:
v1.2.3· Extension key:pixelcoda_fe_editor· Composer package:pixelcoda/fe-editor
Why Pixelcoda FE Editor?
- Edit where content is visible: update headlines and body text directly in the frontend.
- TYPO3-native persistence: all writes use DataHandler, backend permissions, CSRF protection and cache invalidation.
- Premium content operations: drag-and-drop sorting, keyboard move controls and per-element actions.
- Contextual FormEngine canvas: edit complete content records and FAL images without leaving the page.
- Works with existing frontends: automatically detects standard TYPO3
c{uid}wrappers and common content markers. - Headless-ready: explicit record markers support decoupled frontends without changing the save API.
- Accessible by design: keyboard navigation, focus management, reduced motion, visible focus states and responsive light/dark UI.
- Optional AI assistance: server-side OpenAI, Anthropic Claude, OpenRouter and Mistral integration.
Product Screenshots
| Element actions | Drag-and-drop sorting |
|---|---|
| Contextual TYPO3 editor | AI writing assistant |
|---|---|
Installable Extension
The installable TYPO3 extension lives in packages/pixelcoda_fe_editor.
Requirements
- TYPO3
^12.4 || ^13.4 || ^14.0 - PHP supported by the active TYPO3 version
- Authenticated backend user with
tt_contentmodify permission - Optional AI provider API key
Installation
Stable Composer installation after the first TYPO3 Extension Repository publication:
composer require pixelcoda/fe-editor vendor/bin/typo3 extension:setup vendor/bin/typo3 cache:flush
The TER extension key is pixelcoda_fe_editor. Tagged releases are validated,
packaged and published by the Publish extension to TER GitHub Actions
workflow.
Repository-based development:
git clone https://github.com/CasianBlanaru/pixelcoda-typo3-fe-editing.git packages/typo3_fe_editing composer config repositories.pixelcoda-fe-editor path packages/typo3_fe_editing/packages/pixelcoda_fe_editor composer require pixelcoda/fe-editor:@dev vendor/bin/typo3 extension:setup vendor/bin/typo3 cache:flush
For local DDEV development:
ddev composer config repositories.pixelcoda-fe-editor path packages/typo3_fe_editing/packages/pixelcoda_fe_editor
ddev composer require pixelcoda/fe-editor:@dev
ddev exec vendor/bin/typo3 extension:setup
Quality
- PHPStan level max without baseline
- TYPO3 12, 13 and 14 compatibility
- Pa11y WCAG2AA: no issues found
- Lighthouse Desktop Performance: 100
- Lighthouse Accessibility: 100
- Lighthouse Best Practices: 100
- Lighthouse SEO: 100
- Browser-tested contextual editor, action menu, dialogs and drag sorting
The reproducible desktop audit keeps the first visible LCP element unanimated while retaining GSAP and ScrollTrigger on following content. Results: FCP 0.2 s, LCP 0.8 s, TBT 0 ms, CLS 0.
License
See LICENSE and the installable package metadata. Pixelcoda FE Editor is developed and maintained by Casian Blanaru (Pixelcoda).