craftcms/redactor

Edit rich text content in Craft CMS using Redactor by Imperavi.

, _(*1)

Redactor

This plugin adds a “Redactor” field type to Craft CMS, which provides a rich text editor powered by Redactor by Imperavi., _(*2)

Requirements

This plugin requires Craft CMS 4.0 or later., _(*3)

Installation

You can install this plugin from the Plugin Store or with Composer., _(*4)

From the Plugin Store

Go to the Plugin Store in your project’s Control Panel and search for “Redactor”. Then click on the “Install” button in its modal window., _(*5)

With Composer

Open your terminal and run the following commands:, _(*6)

# go to the project directory
cd /path/to/my-project.test

# tell Composer to load the plugin
composer require craftcms/redactor

# tell Craft to install the plugin
./craft install/plugin redactor

Configuration

Redactor Configs

You can create custom Redactor configs that will be available to your Redactor fields. They should be created as JSON files in your config/redactor/ folder., _(*7)

For example, if you created a config/redactor/Standard.json file with the following content:, _(*8)

{
  "buttons": ["html", "format", "bold", "italic", "lists", "link", "file"],
  "plugins": ["fullscreen"]
}

…then a “Standard” option would become available within the “Redactor Config” setting on your Redactor field’s settings., _(*9)

See the Redactor documentation for a list of available config options and buttons., _(*10)

Craft Redactor config options

Craft addes the enforceButtonOrder config option that can be set to a list of button names in the expected order. This option should be used to address the uncontrollable button order set by Redactor when adding plugins to the configuration., _(*11)

HTML Purifier Configs

Redactor fields use HTML Purifier to ensure that no malicious code makes it into its field values, to prevent XSS attacks and other vulnerabilities., _(*12)

You can create custom HTML Purifier configs that will be available to your Redactor fields. They should be created as JSON files in your config/htmlpurifier/ folder., _(*13)

Copy Default.json as a starting point, which is the default config that Redactor fields use if no custom HTML Purifier config is selected., _(*14)

See the HTML Purifier documentation for a list of available config options., _(*15)

For advanced customization, you can modify the HTMLPurifier_Config object directly via the craft\redactor\Field::EVENT_MODIFY_PURIFIER_CONFIG event., _(*16)

use craft\htmlfield\events\ModifyPurifierConfigEvent;
use craft\redactor\Field;
use HTMLPurifier_Config;
use yii\base\Event;

Event::on(
    Field::class,
    Field::EVENT_MODIFY_PURIFIER_CONFIG,
    function(ModifyPurifierConfigEvent $event) {
        /** @var HTMLPurifier_Config $config */
        $config = $event->config;
        // ...
    }
);

Redactor JS Plugins

All first party Redactor JS plugins are bundled by default. To enable them, just add the plugin handle to the plugin array in your Redactor config., _(*17)

{
  "plugins": ["alignment", "fullscreen"]
}

You can also supply your own Redactor plugins by saving them in your config/redactor/ folder. You can either place the plugin directly in that folder, or within a subfolder that is named after the plugin:, _(*18)

config/
└── redactor/
    └── plugins/
        ├── foo.js
        └── bar/
            └── bar.js

Other Craft plugins can supply additional Redactor JS plugin locations using the craft\redactor\Field::EVENT_REGISTER_PLUGIN_PATHS event., _(*19)