ehyiah/ux-quill

Symfony UX Bundle to use Quill JS wysiwyg text editor with full and easy customisation

3.5.0 2026-02-28 20:00 UTC

Requires

• php: >=8.1.0
• symfony/form: ^6.1|^7.0|^8.0
• symfony/stimulus-bundle: ^2.9.1
• symfony/translation: ^6.1|^7.0|^8.0
• symfony/twig-bundle: ^6.1|^7.0|^8.0

Requires (Dev)

• dg/bypass-finals: ^1.6
• easycorp/easyadmin-bundle: ^4.7
• friendsofphp/php-cs-fixer: ^3.1
• friendsoftwig/twigcs: ^6.4
• phpdocumentor/reflection-docblock: <5.2|>=6
• phpstan/phpstan: ^2.1.17
• phpunit/phpunit: ^9.5
• symfony/asset-mapper: ^6.3|^7.0
• symfony/browser-kit: ^6.1|^7.0
• symfony/framework-bundle: ^6.1|^7.0

MIT

• Matthieu Gostiaux

• wysiwyg
• symfony form
• quill
• easyadmin
• quilljs
• symfony-ux
• symfony ux
• symfony wysiwyg
• symfony quill
• symfony ux bundle
• easyadmin wysiwyg

README

Symfony UX Bundle implementing the Quill JS Wysiwyg https://quilljs.com/

Also, Working out of the with EasyAdmin

New Documentation: https://ehyiah.github.io/ux-quill/

If you need an easy-to-use WYSIWYG (with no complex configuration) into a symfony project, this is what you need.

• Installation
• Basic Usage
• Display Result

Installation

Step 1 Require bundle

  composer require ehyiah/ux-quill

If you are using the AssetMapper Component you're done !

step 2 next run (If you are using webpack encore, not needed with AssetMapper)

    yarn install --force
    yarn watch

OR

    npm install --force
    npm run watch

It's done, you can use the QuillType to build a QuillJs WYSIWYG

You can add as many WYSIWYG fields inside same page like any normal fields.

Basic Usage

In a form, use QuillType. It works like a classic Type except it has more options : e.g:

    use Ehyiah\QuillJsBundle\Form\QuillType;

    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            // ...
            ->add('myField', QuillType::class)
        ;
    }

Display result

in a twig template :

• if you use the default class styling option you may need to encapsulate the content so the quill stylesheet can be applied like this :

    <div class="ql-snow">
        <div class="ql-editor">
            {{ myField|raw }}
        </div>
    </div>

• if you use the inline styling option simply :

    <div>{{ myField|raw }}</div>