CKEDITOR 5 - 删除“插入媒体"来自 ClassicEditor 的选项 [英] CKEDITOR 5 - Remove "Insert Media" option from ClassicEditor

问题描述

我在我的 angular 7 应用程序中使用了 CKEditor 5.ClassicEditor 默认显示工具栏上的 Insert Media 按钮，如下图突出显示.

I'm using CKEditor 5 in my angular 7 application. ClassicEditor by default shows the Insert Media button on the toolbar as highlighted in the below image.

在网上研究时，我发现我们可以通过使用 editorConfig 中的 removePlugins 选项来禁用特定选项，如下所示.

On researching online I found we can disable particular options by using the removePlugins option in the editorConfig like below.

editor.component.ts

 editorConfig = {
    removePlugins: ['Image'],
    placeholder: 'Type the content here!'
      };

上面的代码不是删除 Insert Media 选项，而是与 Insert Image 不同的选项.但它不起作用.即使在使用上面的代码之后，我仍然可以在我的 CK 编辑器中看到图像插入选项.

Above code is to not remove the Insert Media option but a different option to Insert Image. But it doesn't work. Even after using the above code I could still see Image insert option in my CK Editor.

我也无法在网上找到我需要在 removePlugins 中提供的内容，以禁用 Insert Media 选项以尝试是否至少有效.任何帮助将不胜感激.

I also couldn't find online what I need to provide in the removePlugins for disabling the Insert Media option to try if atleast that works. Any help will be appreciated.

提前致谢

推荐答案

可以将 CKEditor 的默认配置设置为仅显示我们需要的选项，而不是删除特定按钮.

Instead of removing specific buttons it is possible to set the default configuration of the CKEditor to show only the options which are required to us.

将以下代码添加到 angular component.ts 文件中的构造函数将创建一个简单的 CKEditor，其中仅包含 items 数组中提到的那些选项.mediaEmbed 是负责在 CKEditor 中显示 Insert Video 选项的项目的名称，我在 items 数组中没有提到不显示它在 CKEditor 中.

Adding below code to the constructor in your angular component.ts file will create a simple CKEditor with only those options mentioned in the items array. mediaEmbed is the name of the item responsible for displaying Insert Video option in the CKEditor which I've not mentioned in the items array to not display it in the CKEditor.

ClassicEditor.defaultConfig = {
      toolbar: {
        items: [
          'heading',
          '|',
          'bold',
          'italic',
          '|',
          'bulletedList',
          'numberedList',
          '|',
          'insertTable',
          '|',
          'imageUpload',
          '|',
          'undo',
          'redo'
        ]
      },
      image: {
        toolbar: [
          'imageStyle:full',
          'imageStyle:side',
          '|',
          'imageTextAlternative'
        ]
      },
      table: {
        contentToolbar: [ 'tableColumn', 'tableRow', 'mergeTableCells' ]
      },
      language: 'en'
    };

添加以上代码后的结果

希望这会对某人有所帮助！

Hopes this will help someone!

这篇关于CKEDITOR 5 - 删除“插入媒体"来自 ClassicEditor 的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！