49
4

7 回答 7

73

当使用 protectedSource 解决方案时，i标签不再被剥离，但img标签停止显示在 CKEditor 的 WYSIWIG 模式（我使用的是 4.3.1）。对我来说效果更好的解决方案是禁用删除空i标签使用CKEDITOR.dtd.$removeEmpty

例如，我将以下内容添加到 config.js 

// allow i tags to be empty (for font awesome)
CKEDITOR.dtd.$removeEmpty['i'] = false;

注意：这应该放在CKEDITOR.editorConfig = function( config )函数之外。

于 2014-01-14T16:44:41.793 回答
59

<i>我找到了使用标签遇到的这个特定问题的解决方案

我从drupal论坛得到的原始答案

对其进行修复或调整（您可以命名）是将以下内容设置到 ckeditors config.js 中：

// ALLOW <i></i>
config.protectedSource.push(/<i[^>]*><\/i>/g);

感谢Spasticdonkey将我指向链接。

于 2013-08-15T13:47:17.257 回答
26

这对我有用

在 drupal ckeditor 配置文件设置 admin/config/content/ckeditor/edit/Full 中以相同的顺序添加以下 3 行代码

高级选项 >> 自定义 JavaScript 配置

    config.allowedContent = true;
    config.extraAllowedContent = 'p(*)[*]{*};div(*)[*]{*};li(*)[*]{*};ul(*)[*]{*}';
    CKEDITOR.dtd.$removeEmpty.i = 0;

第一行几乎关闭了高级过滤

第二行是允许所有类 ( )、任何样式 { } 和任何属性 [*] 用于 p、div、li 和 ul。

最后一行是空标签...此行适用于图像...我发现如果您使用 config.protectedSource.push(/]*></i>/g); 它在编辑时去除标签。

于 2015-01-05T21:01:04.300 回答
5

对于 4.3 版本的 ckeditor

在 config.js 中（在配置部分之后）粘贴

CKEDITOR.dtd.$removeEmpty['b'] = false;

并用代码编写小部件

CKEDITOR.plugins.add( 'bwcaret', {
requires: ['widget'/*, 'richcombo'*/],

icons: 'bwcaret',

init: function( editor ) {

    editor.widgets.add( 'bwcaret', {

        button: 'Create a caret',

        template: '<b class="caret"></b>',


        allowedContent: 'b(!caret)',

        requiredContent: 'b(!caret)',

        upcast: function( element ) {
            return element.name == 'b' && element.hasClass( 'caret' );
        },

    });
}

});

于 2013-12-30T13:33:39.480 回答
3

有两个可能的问题：

  • 阅读高级内容过滤器。CKEditor 正在删除不允许的元素，但您可以扩展过滤器的规则。

  • 但是，如果问题是 CKEditor 删除了空<i>元素，那么您需要找到其他使用它的方法。CKEditor 不是所见即所得的网站构建器。它是一个文档编辑器，所以加载的内容必须是有意义的。空的内联元素没有任何意义，因此将其删除，否则编辑器将不知道如何处理它。

    （不久的）将来可能的解决方案之一是使用小部件系统来处理那些空元素。但现在我建议您检查CKEDITOR.htmlDataProcessor和简短指南如何使用它。

于 2013-08-15T11:28:57.857 回答
3

我找到了一个永久的解决方案。实际上发生了什么 ckeditor 只删除了空白标签。无论标签是什么，可能是 b<i>标签或<span>标签

如果您使用任何图标，如 font-awesome、maeterlize 图标等...您可以通过在config.js文件中使用以下代码来停止它

CKEDITOR.dtd.$removeEmpty.span = false; 
CKEDITOR.dtd.$removeEmpty.i = false;

如果您使用更多空白标签，那么您需要在之后添加标签名称$removeEmpty

于 2018-05-28T05:21:44.553 回答
1

CKEditor 4 移除了 emtpy 标签，所以在这里你可以在不更改任何配置设置的情况下进行操作。

代替

<i class="fa-icon-fullscreen fa-icon-xxlarge main-color"></i>

和

<i class="fa-icon-fullscreen fa-icon-xxlarge main-color">&nbsp;</i>

现在<i></i>标签有内容，即&nbsp;CKEditor不会删除该标签。

于 2021-06-24T12:55:50.430 回答