Skip to main content
The rich editor component provides a WYSIWYG editing experience using TipTap.

​
Basic Usage

use Filament\Forms\Components\RichEditor;

RichEditor::make('content')

​
Available Methods

​
toolbarButtons
method
Sets which toolbar buttons are available.
RichEditor::make('content')
    ->toolbarButtons([
        'bold',
        'italic',
        'underline',
        'strike',
        'link',
        'bulletList',
        'orderedList',
        'h2',
        'h3',
        'blockquote',
        'codeBlock',
    ])
​
disableToolbarButtons
method
Disables specific toolbar buttons.
RichEditor::make('content')
    ->disableToolbarButtons(['codeBlock', 'strike'])
​
fileAttachmentsDisk
method
Sets the disk for file attachments.
RichEditor::make('content')
    ->fileAttachmentsDisk('s3')
​
fileAttachmentsDirectory
method
Sets the directory for file attachments.
RichEditor::make('content')
    ->fileAttachmentsDirectory('attachments')
​
fileAttachmentsVisibility
method
Sets visibility for file attachments.
RichEditor::make('content')
    ->fileAttachmentsVisibility('private')
​
disableGrammarly
method
Disables Grammarly.
RichEditor::make('content')
    ->disableGrammarly()
​
maxContentWidth
method
Sets maximum content width.
RichEditor::make('content')
    ->maxContentWidth('5xl')

​
Common Patterns

​
Blog Post Editor

RichEditor::make('content')
    ->toolbarButtons([
        'bold',
        'italic',
        'link',
        'bulletList',
        'orderedList',
        'h2',
        'h3',
        'blockquote',
    ])
    ->fileAttachmentsDisk('public')
    ->fileAttachmentsDirectory('blog-attachments')
    ->required()

​
Simple Editor

RichEditor::make('description')
    ->toolbarButtons([
        'bold',
        'italic',
        'link',
        'bulletList',
    ])
    ->maxContentWidth('full')

RichEditor::make('content')
    ->fileAttachmentsDisk('s3')
    ->fileAttachmentsDirectory('documents')
    ->maxContentWidth('5xl')
    ->required()

Build docs developers (and LLMs) love

Get started for freeTalk to us