时间戳

首页 > 解决方案 > 需要帮助在 Laravel Voyager 中配置 TinyMCE

laravel - 需要帮助在 Laravel Voyager 中配置 TinyMCE

问题描述

我想在 Laravel Voyager 中调整 TinyMCE 的默认配置。特别是，我想删除在正文内容中创建 H1 标记的选项，因为从语义上讲，页面上应该只有一个 H1，并且它存储在不同的字段中。

Voyager 的说明非常简单：

https://voyager-docs.devdojo.com/customization/tinymce

所以，我： 1. 在 resources/js 中创建了一个名为 voyager_additional.js 的新文件，2. 将它添加到我的 Mix 配置中 (.js('resources/js/voyager_additional.js', 'public/js')，3.添加了 Voyager 文档中指定的两个函数，

function tinymce_init_callback(editor)
{
    console.log('Init!');
}

function tinymce_setup_callback(editor)
{
    console.log('Setup!');
}
  1. 将 console.log 消息放入函数中以证明它们正在被调用，并且
  2. 将 'js/voyager_additional.js' 添加到 config/voyager.php 中的 additional_js 数组中。

附加的 JavaScript 文件正在正确的位置创建，我的 Voyager 管理页面可以找到它，但有些地方不对，因为 console.log 消息从未出现（我在函数中放入的 TinyMCE 代码似乎都没有效果，要么）。显然，它比文档显示的要多一点。我错过了什么？

标签： laraveltinymcevoyager

解决方案

啊啊啊……不要像处理 Mix 文件中的 .js 那样处理额外的 JavaScript 代码。只需复制它：

.copy('resources/js/voyager_additional.js', 'public/js')

现在我的 console.log 消息出现了，我对 TinyMCE 配置所做的更改工作。

（快速说明：设置更改的格式应为，例如：

editor.settings.style_formats = [
        { title: 'Heading 2', format: 'h2' },
        { title: 'Heading 3', format: 'h3' },
        { title: 'Paragraph', format: 'p' },
    ];
    editor.settings.toolbar = 'removeformat | styleselect bold italic | alignleft aligncenter alignright | bullist numlist outdent indent | link image table | code';

并且更改似乎要在设置中，而不是在 init 函数中。）

我很高兴这原来是一件小而简单的事情！

推荐阅读