README

A block editor Filament form field. Replaces a plain textarea with a fullscreen drag-and-drop HTML block builder.

Features

• Fullscreen modal editor inside a Filament form
• Block types: Paragraph, Heading (H2/H3/H4), Image, 2 Columns, Button, Divider, Spacer, Raw HTML
• Move, duplicate and delete blocks
• Saves as JSON (block structure) to the field
• BlockEditor::renderHtml($json) to get the rendered HTML for frontend display
• Works with any Filament v3/v4 form

Installation

composer require matteomascellani/filament-block-editor

Usage

use Matteomascellani\FilamentBlockEditor\Forms\Components\BlockEditor;

// In your Filament Resource form:
BlockEditor::make('content'),

The field stores a JSON string. On your frontend, render it to HTML:

use Matteomascellani\FilamentBlockEditor\Forms\Components\BlockEditor;

{!! BlockEditor::renderHtml($record->content) !!}

Block Types

Plugin (optional)

If you need to hook into the Filament panel:

// In your PanelProvider:
->plugins([
    \Matteomascellani\FilamentBlockEditor\FilamentBlockEditorPlugin::make(),
])

License

MIT