PHPackages advoor/nova-editor-js - 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. [Utility & Helpers](/categories/utility) 4. / 5. advoor/nova-editor-js ActiveLibrary[Utility & Helpers](/categories/utility) advoor/nova-editor-js ===================== A Laravel Nova field bringing EditorJs magic to Nova. v5.0.0(1mo ago)92219.3k—4.8%66[7 issues](https://github.com/advoor/nova-editor-js/issues)[18 PRs](https://github.com/advoor/nova-editor-js/pulls)3MITPHPPHP ^8.2CI failing Since Apr 2Pushed 1mo ago5 watchersCompare [ Source](https://github.com/advoor/nova-editor-js)[ Packagist](https://packagist.org/packages/advoor/nova-editor-js)[ RSS](/packages/advoor-nova-editor-js/feed)WikiDiscussions master Synced 3d ago READMEChangelog (10)Dependencies (18)Versions (48)Used By (3) Laravel Nova Editor JS Field ============================ [](#laravel-nova-editor-js-field) [![Latest Version on Github](https://camo.githubusercontent.com/4222aacd933a45ad16bb88677a32f578598f693f2978a5e5bd0db6b4de48f91d/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f72656c656173652f6164766f6f722f6e6f76612d656469746f722d6a732e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/advoor/nova-editor-js)[![Total Downloads](https://camo.githubusercontent.com/7bca1cb93d4edcb6a51030571fe707bcedc24596a55ad9c5358f4cbb363fb0e6/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6164766f6f722f6e6f76612d656469746f722d6a732e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/advoor/nova-editor-js) A Laravel Nova implementation of [Editor.js](https://github.com/codex-team/editor.js)by [@advoor](https://github.com/advoor). Installation ------------ [](#installation) Install via composer: ``` composer require advoor/nova-editor-js ``` Publish the config file ``` php artisan vendor:publish --provider="Advoor\NovaEditorJs\FieldServiceProvider" ``` Version Compatibility --------------------- [](#version-compatibility) Laravel Nova 4.x isn't backwards compatible with 3.x, so we had to make a version split. Please use the below table to find which versions are suitable for your installation. Package versionNova VersionLaravel VersionPHP version`4.x`4.x - 5.x10.x - 13.x8.2+`3.x`4.x8.x - 10.x8.1+`2.x`2.x - 3.x5.x - 8.x5.6 - 7.4Note that we really pushed the PHP version up. If you're staying on new versions of Laravel and Nova, we're expecting your PHP version to match that behaviour. Upgrade ------- [](#upgrade) See [the upgrade guide](./UPGRADING.md). Usage ----- [](#usage) To add EditorJS to your application, you'll need to modify your Nova resource. For ease-of-use we also recommend to update your models, but that's optional. ### Updating your Nova resource [](#updating-your-nova-resource) This package exposes a `NovaEditorJsField` that takes care of displaying the HTML contents and providing the user with the EditorJS field. To use it, simply import the field, ``` use Advoor\NovaEditorJs\NovaEditorJsField; ``` use it in your fields array, ``` return [ // … NovaEditorJsField::make('about'), ]; ``` And boom, you've got yourself a fancy editor. ### Updating your models (optional) [](#updating-your-models-optional) For ease-of-use, we recommend you add the `NovaEditorJsCast` to the `$casts` on your models. This will map the value to a `NovaEditorJsData` model, which can be returned in Blade (rendering HTML), or sent via API calls (rendering JSON, unless you call `toHtml` on it or cast it to a string). ``` use Advoor\NovaEditorJs\NovaEditorJsCast; class User extends Model { protected $casts = [ 'about' => NovaEditorJsCast::class, ]; } ``` Since the `NovaEditorJsData` model is an `Htmlable`, Blade will recognize it as safe HTML. This means you don't have to use Blade "unescaped statements". ``` About {{ $user->name }} {{ $user->about }} ``` ### Rendering HTML without model changes [](#rendering-html-without-model-changes) You can also use the `NovaEditorJs` facade to render HTML from stored data. ``` NovaEditorJs::generateHtmlOutput($user->about); ``` The return value of `generateHtmlOutput` is an `HtmlString`, which is treated as safe by Blade. This means you don't have to use Blade "unescaped statements". ``` About {{ $user->name }} {{ NovaEditorJs::generateHtmlOutput($user->about) }} ``` Customizing ----------- [](#customizing) You can configure the editor settings and what tools the Editor should use, by updating the `editorSettings` and `toolSettings` property in the config file respectively. From the config, you can define the following editor settings: - `placeholder` ([docs](https://editorjs.io/configuration#placeholder)) - The placeholder to show in an empty editor - `defaultBlock` ([docs](https://editorjs.io/configuration#change-the-default-block)) - The block that's used by default - `autofocus` ([docs](https://editorjs.io/configuration#autofocus)) - If the editor should auto-focus, only use if you never have multiple editors on a page and after considering the [accessibility implications](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus#accessibility_considerations) - `rtl` ([docs](https://editorjs.io/i18n#rtl-support)) - Set to true to enable right-to-left mode, for languages like Arabic and Hebrew Furthermore, you can customize the tools the editor should use. The following tools are enabled by default: - [Header](https://github.com/editor-js/header) - [Image](https://github.com/editor-js/image) - [Link](https://github.com/editor-js/link) - [List](https://github.com/editor-js/list) - [Code block](https://github.com/editor-js/code) - [Inline code](https://github.com/editor-js/inline-code) - [Checklist](https://github.com/editor-js/checklist) - [Marker](https://github.com/editor-js/marker) - [Embeds](https://github.com/editor-js/embed)† - [Delimiter](https://github.com/editor-js/delimiter) - [Table](https://github.com/editor-js/table) - [Raw](https://github.com/editor-js/raw) You can customize the views for each component, by changing the view in `resources/views/vendor/nova-editor-js/`. † The *Embeds* tool is triggered by pasting URLs to embeddable content. It does not have an entry in the "Add" menu. ### Registering custom components [](#registering-custom-components) Please refer to the [extending Nova EditorJS](./EXTENDING.md) guide on instructions on how to register custom components. ### Health Score 69 — FairBetter than 100% of packages Maintenance92 Actively maintained with recent releases Popularity52 Moderate usage in the ecosystem Community31 Small or concentrated contributor base Maturity86 Battle-tested with a long release history Bus Factor2 2 contributors hold 50%+ of commits 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 ~81 days Recently: every ~231 days Total 33 Last Release 33d ago Major Versions v0.6.6 → v1.0.02020-07-03 v1.0.1 → v2.0.02020-08-03 v2.0.3 → v3.0.02022-06-29 v3.3.0 → v4.0.02024-04-19 v4.1.1 → v5.0.02026-06-01 PHP version history (4 changes)0.0.1PHP >=7.1.0 v3.0.0PHP ^8.0 v3.0.1PHP ^8.1 v4.0.0PHP ^8.2 ### Community Maintainers ![](https://avatars.githubusercontent.com/u/4472195?v=4)[advoor](/maintainers/advoor)[@advoor](https://github.com/advoor) --- Top Contributors [![advoor](https://avatars.githubusercontent.com/u/4472195?v=4)](https://github.com/advoor "advoor (78 commits)")[![roelofr](https://avatars.githubusercontent.com/u/1771026?v=4)](https://github.com/roelofr "roelofr (61 commits)")[![stickeerehan](https://avatars.githubusercontent.com/u/41327712?v=4)](https://github.com/stickeerehan "stickeerehan (22 commits)")[![Woeler](https://avatars.githubusercontent.com/u/18422096?v=4)](https://github.com/Woeler "Woeler (5 commits)")[![TheDeadCode](https://avatars.githubusercontent.com/u/1714641?v=4)](https://github.com/TheDeadCode "TheDeadCode (3 commits)")[![techouse](https://avatars.githubusercontent.com/u/1174328?v=4)](https://github.com/techouse "techouse (3 commits)")[![anstapol](https://avatars.githubusercontent.com/u/33395021?v=4)](https://github.com/anstapol "anstapol (3 commits)")[![lorado](https://avatars.githubusercontent.com/u/4480983?v=4)](https://github.com/lorado "lorado (2 commits)")[![Reflow1319](https://avatars.githubusercontent.com/u/6665500?v=4)](https://github.com/Reflow1319 "Reflow1319 (2 commits)")[![xamthor](https://avatars.githubusercontent.com/u/69559791?v=4)](https://github.com/xamthor "xamthor (1 commits)")[![emkcloud](https://avatars.githubusercontent.com/u/5731295?v=4)](https://github.com/emkcloud "emkcloud (1 commits)")[![Harrk](https://avatars.githubusercontent.com/u/2372590?v=4)](https://github.com/Harrk "Harrk (1 commits)")[![pravk](https://avatars.githubusercontent.com/u/926011?v=4)](https://github.com/pravk "pravk (1 commits)")[![RogierW](https://avatars.githubusercontent.com/u/9381528?v=4)](https://github.com/RogierW "RogierW (1 commits)")[![waelelsawy](https://avatars.githubusercontent.com/u/10009971?v=4)](https://github.com/waelelsawy "waelelsawy (1 commits)")[![bangnokia](https://avatars.githubusercontent.com/u/5652494?v=4)](https://github.com/bangnokia "bangnokia (1 commits)") --- Tags laravellaravel-novalaravel-nova-fieldlaraveleditorwysiwygnovaeditorjs ### Code Quality Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/advoor-nova-editor-js/health.svg) ``` [![Health](https://phpackages.com/badges/advoor-nova-editor-js/health.svg)](https://phpackages.com/packages/advoor-nova-editor-js) ``` ### Alternatives [psalm/plugin-laravel Psalm plugin for Laravel 3355.3M346](/packages/psalm-plugin-laravel)[roots/acorn Framework for Roots WordPress projects built with Laravel components. 9762.4M131](/packages/roots-acorn)[nativephp/mobile NativePHP for Mobile 1.1k75.1k91](/packages/nativephp-mobile)[spatie/laravel-export Create a static site bundle from a Laravel app 674146.0k6](/packages/spatie-laravel-export)[flarum/core Delightfully simple forum software. 201.4M2.3k](/packages/flarum-core)[venturedrake/laravel-crm A free open source CRM built as a package for laravel projects 43311.2k](/packages/venturedrake-laravel-crm) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)