new
Free
Download the package from the manager of your site.
How to download?
How to download?
The author
Ivan Bochkarev
Packages
9 Downloads
61 
Warning! This component requires PHP
8.2
or higher!
Warning! This package requires MODX 3 or higher.
⚡ mxEditorJs — Editor.js block editor for MODX 3
Integrates Editor.js into the MODX 3 admin panel as a replacement for the standard Rich Text Editor. Content is stored in Editor.js's canonical JSON format, and an HTML snapshot is automatically generated on the frontend.
🪟 Block Editor
📺 Embed — embeddable content
✨ Key Features.
🚀 Quick Start
📋 Requirements
Integrates Editor.js into the MODX 3 admin panel as a replacement for the standard Rich Text Editor. Content is stored in Editor.js's canonical JSON format, and an HTML snapshot is automatically generated on the frontend.
🪟 Block Editor
- 13 block types: paragraph, heading, list, checklist, quote, table, code, raw HTML, embed, image, attachment, separator, warning
- Inline tools: marker, inline-code, underline, link
- Text alignment (tune) for paragraphs, headings, lists, and quotes
- Undo/Redo — undo actions supported
📺 Embed — embeddable content
- YouTube, RuTube, Vimeo, Twitch, Instagram, Facebook, Twitter/X, and other services
- URL insertion via Paste API — just copy the link and paste it into the editor
- Correct frontend rendering — blocks are displayed As an iframe with allowfullscreen and lazy loading support.
- Add custom services via configuration.
✨ Key Features.
- TV Field Support — The editor works in the main content and in additional fields (textarea + richtext).
- Media Upload — Drag-and-drop images and files via MODX Media Sources.
- File Browser — Built-in viewer with directory navigation.
- Link Autocompletion — Searches for MODX resources when inserting links.
- HTML → Editor.js Migration — Automatic conversion of existing HTML content.
- Tool Profiles — Presets (default, minimal, blog, full) and custom.
- Fullscreen mode and Source Preview mode (viewing generated HTML)
- Localization — Russian and English, inherits the manager's locale
- CSS presets — customizable classes for images and links
🚀 Quick Start
- Install the package via Extras → Installer
- In system settings, set which_editor = mxEditorJs
- Open any resource — Editor.js will appear in the content field
📋 Requirements
- MODX Revolution 3.0.3+
- PHP 8.2+
- Node.js 18+ (only for building from source code)
Changelog
All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
[1.0.0-beta1] - 2026-03-07
First beta release of mxEditorJs for MODX 3.
Added
- Block-style editor for resource
contentfield based on Editor.js - Canonical JSON storage in dedicated sidecar table (
mxeditorjs_content) - HTML snapshot rendering to
modResource.contentfor frontend compatibility - Core block types: Paragraph, Header, List
- Extended block types: Quote, Code, Delimiter, Table, Raw HTML
- Image upload integration with MODX Media Sources
- Smart internal linking with resource autocomplete (LinkAutocomplete tool)
- External, email, and anchor link support
- Fullscreen editing mode
- Source preview (read-only HTML view)
- HTML-to-JSON migration for legacy content
- Content validation with JSON schema (ContentValidator)
- MIME type validation for uploads via
finfo_file() - Permission checks for
save_documenton all operations - Filename sanitization with incremental naming for duplicates
- Graceful fallback to textarea on editor initialization failure
- Full lexicon support (Russian, English)
Technical
- MODX 3 only (no MODX 2 support)
- PHP 8.2+ required
- TypeScript frontend with esbuild bundling
- Plugin events:
OnRichTextEditorRegister,OnDocFormPrerender,OnResourceDelete - Namespace:
mxeditorjs
Dependencies
- Editor.js 2.x (bundled)
- MODX 3.0.3+