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屋！