Кастомизация TinyMCE в Voyager

В Voyager встроин редактор кода TinyMCE, файл дефолтной настройки расположен в директории vendor\tcg\voyager\resources\assets\js\voyager_tinymce_config.js, при кастомизации его мы не трогаем, а работаем с конфигом.

Откройте config/voyager.php, в файле есть две директивы additional_js отвечает за js и additional_css отвечает за css, раскомментируйте строку js/custom.js, как показано ниже и сохраните файл:

config/voyager.php'additional_js' => [
  'js/custom.js',
],

Создайте файл custom.js в папке public/js и вставьте кастомный код который добавляет кнопку выполняющию добавление <p>Привет весь мир!</p> в поле редактора:

public/js/custom.jsfunction tinymce_setup_callback(editor) {
    // Удаляем экземпляр tinymce который создает voyager
    editor.remove();
    editor = null;
    // Инициализируем свой tinymce
    tinymce.init({
        // Селектор по которому выбираем textarea
        selector: "#richtextbody",
        // Задаем высоту редактора
        height: 200,
        // Тулбар наша костомная функция
        toolbar: "myCustom",
        // Запрет на вывод менюбара
        menubar: false,
        // Кастомная функция
        setup: function (editor) {
            // Регистрируем новую кнопку
            editor.ui.registry.addButton("myCustom", {
                // Название на панели
                text: "My Custom Button",
                // Действие
                onAction: function () {
                    editor.insertContent("<p>Привет весь мир!</p>");
                },
            });
        },
    });
    // Здесь будут данные из редактора (можно не указывать)
    tinymce.get("richtextbody").getContent();
}

Манипуляция до инициализации TinyMCE:

public/js/custom.jsfunction tinymce_setup_callback(editor)
{
    //...
}

Манипуляция после инициализации TinyMCE:

public/js/custom.jsfunction tinymce_init_callback(editor)
{
    //...
}

Для небольших правок, достаточно в режиме BREAD внести правки в нужное поле, это поможет например увеличить высоту редактора:

{
  "tinymceOptions" : {
      "name": "value"
  }
}