TinyMCE

У редактора своя жизнь за пределами WordPress: это открытый проект, который используют многие CMS и веб-приложения. WordPress встроил его в 2000-х, и до выхода версии 5.0 почти каждый текст на сайтах этой CMS набирался именно в нём. Панель с кнопками «Ж», «К», списками и выравниванием, вкладка «Визуально» над полем записи — всё это TinyMCE. Он реализует принцип WYSIWYG: автор видит форматированный текст, а редактор сам формирует HTML.

Где он остался сегодня

Основным редактором стал блочный, но TinyMCE из ядра не убрали. Он работает внутри классического блока, во всём редакторе при установленном плагине Classic Editor, в полях «Визуальный редактор» у плагинов произвольных полей, в описаниях товаров WooCommerce и везде, где плагин выводит редактор функцией wp_editor(). Версия, которая поставляется с WordPress, давно не обновлялась до последней ветки TinyMCE — ради совместимости с тысячами плагинов.

Пример: выпадающий список стилей

Панель кнопок настраивается фильтрами mce_buttons, mce_buttons_2 и tiny_mce_before_init. Например, так редакторы получают меню с готовыми оформлениями абзаца:

add_filter( 'mce_buttons_2', function ( $buttons ) {
    array_unshift( $buttons, 'styleselect' );
    return $buttons;
} );

add_filter( 'tiny_mce_before_init', function ( $init ) {
    $init['style_formats'] = wp_json_encode( [
        [ 'title' => 'Важно', 'block' => 'p', 'classes' => 'note' ],
    ] );
    return $init;
} );

Чтобы оформление в редакторе совпадало с сайтом, тема подключает свои стили через add_editor_style().

Сюрпризы при работе

• Редактор чистит разметку: часть атрибутов и пустые теги исчезают при переключении между вкладками «Визуально» и «Текст».
• Абзацы в базе хранятся без тегов <p> — их расставляет функция wpautop() при выводе. Поэтому HTML, вставленный в базу напрямую, иногда выглядит иначе.
• Текст, скопированный из Word, приносит лишние стили и шрифты. Помогает вставка как обычного текста.

При переходе на редактор блоков старые записи открываются одним классическим блоком, и их можно разбить на блоки командой «Преобразовать в блоки».