PHPackages                             haosheng0211/filament-forms-tinymce - 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. haosheng0211/filament-forms-tinymce

ActiveLibrary

haosheng0211/filament-forms-tinymce
===================================

A Filament v3 form field that integrates TinyMCE 8 rich text editor with dark mode, profiles, and file browser support.

v1.2.0(2d ago)06↑400%MITPHPPHP ^8.2CI passing

Since Mar 16Pushed 2d agoCompare

[ Source](https://github.com/haosheng0211/filament-forms-tinymce)[ Packagist](https://packagist.org/packages/haosheng0211/filament-forms-tinymce)[ Docs](https://github.com/haosheng0211/filament-forms-tinymce)[ RSS](/packages/haosheng0211-filament-forms-tinymce/feed)WikiDiscussions main Synced today

READMEChangelogDependencies (10)Versions (4)Used By (0)

Filament Forms TinyMCE
======================

[](#filament-forms-tinymce)

[![Latest Version on Packagist](https://camo.githubusercontent.com/16a90dcfc513e9c0da76dccabf85fe093070cd2b9efe1267867b284b2bc8bd73/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f68616f7368656e67303231312f66696c616d656e742d666f726d732d74696e796d63652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/haosheng0211/filament-forms-tinymce)[![GitHub Tests Action Status](https://camo.githubusercontent.com/60f35c858663ed553f7531bf0cba0d8f7b7a59ff0be59d45f5fdf80ad4903510/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f68616f7368656e67303231312f66696c616d656e742d666f726d732d74696e796d63652f72756e2d74657374732e796d6c3f6272616e63683d6d61696e266c6162656c3d7465737473267374796c653d666c61742d737175617265)](https://github.com/haosheng0211/filament-forms-tinymce/actions?query=workflow%3Arun-tests+branch%3Amain)[![Total Downloads](https://camo.githubusercontent.com/b4d858f324bfc17c96890f724f9040e14309e780a1a0d97a5337f48263e46302/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f68616f7368656e67303231312f66696c616d656e742d666f726d732d74696e796d63652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/haosheng0211/filament-forms-tinymce)

A [Filament v3](https://filamentphp.com) form field that integrates [TinyMCE 8](https://www.tiny.cloud/) rich text editor.

Requirements
------------

[](#requirements)

- PHP ^8.2
- Laravel ^10.0 / ^11.0 / ^12.0
- Filament ^3.0

Installation
------------

[](#installation)

```
composer require haosheng0211/filament-forms-tinymce
```

Publish the config file:

```
php artisan vendor:publish --tag="filament-forms-tinymce-config"
```

Usage
-----

[](#usage)

### Basic

[](#basic)

```
use MrJin\FilamentFormsTinymce\TinyMceEditor;

TinyMceEditor::make('content')
```

### Profiles

[](#profiles)

Profiles let you define reusable editor presets in the config file. Three built-in profiles are provided: `default`, `simple`, and `full`.

```
TinyMceEditor::make('content')
    ->profile('simple')
```

Define your own profiles in the config:

```
// config/filament-forms-tinymce.php

'profiles' => [
    'blog' => [
        'plugins' => 'lists link image media code',
        'toolbar' => 'blocks | bold italic | link image media | code',
        'menubar' => false,
        'height' => 500,
    ],
],
```

**Priority order:** instance method &gt; profile &gt; TinyMCE built-in default

```
// Profile sets height to 500, but this instance overrides it to 800
TinyMceEditor::make('content')
    ->profile('blog')
    ->height(800)
```

### Editor options

[](#editor-options)

All TinyMCE options can also be set directly via fluent methods without using profiles:

```
TinyMceEditor::make('content')
    ->toolbar('bold italic underline | bullist numlist | link image media')
    ->plugins('lists link image media table code')
    ->menubar('file edit view insert format')
    ->height(500)
    ->language('zh_TW')
    ->skin('oxide-dark')
    ->contentCss('dark')
```

For any TinyMCE init option not covered by a dedicated method, use `options()`:

```
TinyMceEditor::make('content')
    ->options([
        'branding' => false,
        'resize' => true,
        'paste_as_text' => true,
    ])
```

### File browser

[](#file-browser)

The file browser integration is **enabled by default**. When enabled, TinyMCE's `file_picker_callback` dispatches Livewire events (`open-media-browser` / `media-selected`) so you can connect your own media browser component.

> **Tip:** Install [`haosheng0211/filament-media-browser`](https://github.com/haosheng0211/filament-media-browser) for a ready-made media browser that works out of the box.

```
composer require haosheng0211/filament-media-browser
```

#### Disable file browser

[](#disable-file-browser)

```
TinyMceEditor::make('content')
    ->fileBrowser(false)
```

#### Media disk &amp; directory

[](#media-disk--directory)

You can specify the disk and directory to pass to the media browser:

```
TinyMceEditor::make('content')
    ->mediaDisk('s3')
    ->mediaDirectory('uploads/articles')
```

#### URL format

[](#url-format)

TinyMCE always requests full URLs from the media browser (`storeAsUrl: true`), regardless of the media browser's global `store_as_url` setting. The final URL format stored in HTML is controlled by TinyMCE's built-in URL conversion options:

Desired outputConfiguration`/storage/media/photo.jpg` (default)`relative_urls: false`, `remove_script_host: true``http://domain.com/storage/media/photo.jpg``relative_urls: false`, `remove_script_host: false`Keep original URL`convert_urls: false`The default profile already includes `relative_urls: false` and `remove_script_host: true`, which produces portable absolute paths without the domain.

For **email templates** that require full URLs (email clients cannot resolve relative paths), use a dedicated profile or override via `options()`:

```
// Option 1: Use a profile
TinyMceEditor::make('email_body')
    ->profile('email')

// Option 2: Override inline
TinyMceEditor::make('email_body')
    ->options(['remove_script_host' => false])
```

### Merge tags

[](#merge-tags)

Insert predefined variables into the editor via a toolbar dropdown — useful for email templates. No TinyMCE Premium required.

#### Via profile (recommended)

[](#via-profile-recommended)

Define merge tags in a profile so all fields using that profile share the same variables:

```
// config/filament-forms-tinymce.php
'profiles' => [
    'email' => [
        'plugins' => 'lists link image media table code wordcount',
        'toolbar' => 'undo redo | blocks | bold italic | mergetags | link image | removeformat',
        'menubar' => false,
        'height' => 480,
        'mergetags' => [
            ['value' => 'user.name', 'title' => '使用者名稱'],
            ['value' => 'user.email', 'title' => '使用者信箱'],
            ['title' => '網站', 'menu' => [
                ['value' => 'site.name', 'title' => '網站名稱'],
                ['value' => 'site.url', 'title' => '網站網址'],
            ]],
        ],
        'mergetag_prefix' => '{{',  // optional, defaults to '{{'
        'mergetag_suffix' => '}}',  // optional, defaults to '}}'
        'custom_configs' => [
            'relative_urls' => false,
            'remove_script_host' => false,
        ],
    ],
],
```

```
TinyMceEditor::make('email_body')
    ->profile('email')
```

Selecting "使用者名稱" inserts `{{user.name}}` into the editor.

#### Via instance methods

[](#via-instance-methods)

Instance methods take priority over profile settings:

```
TinyMceEditor::make('email_body')
    ->toolbar('undo redo | blocks | bold italic | mergetags | removeformat')
    ->mergetags([
        ['value' => 'user.name', 'title' => 'User Name'],
    ])
    ->mergetagPrefix('${')
    ->mergetagSuffix('}')
// Inserts: ${user.name}
```

### TinyMCE source

[](#tinymce-source)

TinyMCE is loaded from jsDelivr CDN with SRI integrity check. No API key required.

You can customise the CDN URL and version in the config:

```
'cdn_url' => 'https://cdn.jsdelivr.net/npm/tinymce@{version}/tinymce.min.js',
'version' => '8.3.2',
```

Config reference
----------------

[](#config-reference)

```
return [
    'cdn_url' => 'https://cdn.jsdelivr.net/npm/tinymce@{version}/tinymce.min.js',
    'version' => '8.3.2',

    // SRI hash for CDN (set to null to disable)
    'integrity' => 'sha384-...',
    'crossorigin' => 'anonymous',

    // Profiles (pre-defined editor configurations)
    'profiles' => [
        'default' => [
            'plugins' => 'lists link image media table code wordcount',
            'toolbar' => 'undo redo | blocks | bold italic underline strikethrough | ...',
            'menubar' => false,
            'height' => 480,
            'custom_configs' => [
                'relative_urls' => false,
                'remove_script_host' => true,
            ],
        ],
        'simple' => [ /* ... */ ],
        'full'   => [ /* ... */ ],
        // 'email' => [
        //     'custom_configs' => [
        //         'relative_urls' => false,
        //         'remove_script_host' => false,
        //     ],
        // ],
    ],
];
```

Testing
-------

[](#testing)

```
composer test
```

Changelog
---------

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.

Security Vulnerabilities
------------------------

[](#security-vulnerabilities)

Please review [our security policy](../../security/policy) on how to report security vulnerabilities.

Credits
-------

[](#credits)

- [Mr.Jin](https://github.com/haosheng0211)
- [All Contributors](../../contributors)

License
-------

[](#license)

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

###  Health Score

42

—

FairBetter than 90% of packages

Maintenance100

Actively maintained with recent releases

Popularity6

Limited adoption so far

Community2

Small or concentrated contributor base

Maturity48

Maturing project, gaining track record

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 ~3 days

Total

3

Last Release

2d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/7844510af454731ef9d8d0c8dfe93a227fef3011b409e8a8cd3fb6b903dc81c7?d=identicon)[haosheng](/maintainers/haosheng)

---

Tags

laravelwysiwygtinymcefilamentfilament-pluginrich-text-editorform-field

###  Code Quality

TestsPest

Code StyleLaravel Pint

### Embed Badge

![Health badge](/badges/haosheng0211-filament-forms-tinymce/health.svg)

```
[![Health](https://phpackages.com/badges/haosheng0211-filament-forms-tinymce/health.svg)](https://phpackages.com/packages/haosheng0211-filament-forms-tinymce)
```

###  Alternatives

[croustibat/filament-jobs-monitor

Background Jobs monitoring like Horizon for all drivers for FilamentPHP

241238.6k5](/packages/croustibat-filament-jobs-monitor)[caresome/filament-auth-designer

Transform Filament's default auth pages into stunning, brand-ready experiences

3711.7k1](/packages/caresome-filament-auth-designer)[afatmustafa/filamentv3-turnstile

A plugin to help you implement the Cloudflare Turnstile into your Filament panels.

1524.9k](/packages/afatmustafa-filamentv3-turnstile)[caresome/filament-neobrutalism-theme

A neobrutalism theme for FilamentPHP admin panels

292.5k](/packages/caresome-filament-neobrutalism-theme)[thiktak/filament-simple-list-entry

Simple List Entry for Infolist

233.6k](/packages/thiktak-filament-simple-list-entry)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
