Ckeditor 块/内联'；元标记&x27；在编辑中

我正在开发一个定制的CMS，其中集成了CKEditor（4.5.1）以生成友好的HTML内容

我们提供的一个功能是能够将页面的某些部分限制为特定的用户组，而据我所知，最干净的方法就是创建一个新标签，并将其用于跟踪内容，例如，

此处限制用户类型1、2、3的内容

，这将由后端剥离

我的问题是，我的自定义标记隐式地需要同时支持块标记和内联标记，我不知道如何正确设置

我尝试了各种各样的组合，要么根本不允许添加任何内容，要么完全禁用插件（因为它与ACF自身的健全性检查相冲突）；现在，我的配置将允许我添加

块，允许我在对话框中编辑它（包括双击），但不允许我嵌套任何类型的内容，并将导致CKEditor在切换回源代码模式时抛出“无法读取null属性”警告

我目前对这个插件的配置如下：

    CKEDITOR.dtd.restrict = {
        a: 1, abbr: 1, address: 1, area: 1, article: 1, aside: 1, audio: 1, b: 1, bdi: 1, bdo: 1, blockquote: 1,
        br: 1, button: 1, canvas: 1, cite: 1, code: 1, command: 1, datalist: 1, del: 1, details: 1, dfn: 1, div: 1,
        dl: 1, em: 1, embed: 1, fieldset: 1, figure: 1, footer: 1, form: 1, h1: 1, h2: 1, h3: 1, h4: 1, h5: 1, h6: 1,
        header: 1, hgroup: 1, hr: 1, i: 1, iframe: 1, img: 1, input: 1, ins: 1, kbd: 1, keygen: 1, label: 1, map: 1,
        mark: 1, meter: 1, noscript: 1, object: 1, ol: 1, output: 1, progress: 1, p: 1, pre: 1, q: 1, ruby: 1, s: 1,
        samp: 1, script: 1, section: 1, select: 1, small: 1, span: 1, strong: 1, sub: 1, sup: 1, table: 1,
        textarea: 1, time: 1, u: 1, ul: 1, 'var': 1, video: 1, wbr: 1, '#': 1
    }; // Allow <restrict> as a valid tag.
    CKEDITOR.dtd.$block.restrict = 1;
    CKEDITOR.dtd.$inline.restrict = 1;
    CKEDITOR.dtd.$blockLimit.restrict = 1; // Treat <restrict> as a block limiter tag
    CKEDITOR.dtd.$removeEmpty.restrict = 1; // Remove <restrict /> tags if they are empty
    CKEDITOR.dtd.$transparent.restrict = 1; // Treat the tag as transparent as far as content models go
    CKEDITOR.dtd.body.restrict = 1; // Allow it in the body, div and p tags.
    CKEDITOR.dtd.div.restrict = 1;
    CKEDITOR.dtd.p.restrict = 1;

    var allowedEls = ['restrict'];
    for (var i in CKEDITOR.dtd.restrict) {
        if (CKEDITOR.dtd.restrict.hasOwnProperty(i) && i != '#') {
            allowedEls.push(i);
        }
    }

    // Define the widget.
    editor.widgets.add( 'restrict', {
        button: 'Restricted Content',
        dialog: 'restrictDialog',
        template: '<restrict />',
        editables: {},
        allowedContent: allowedEls.join(' ') + '[*]{*}(*)', // All the above elements, with any attributes, styles or classes.
        requiredContent: 'restrict[data-*]',
        upcast: function (element) {
            return element.name == 'restrict';
        },
        init: function () {
            // Some stuff which iterates through the various
            // properties I care about, grabs from data
            // attributes and pushes to this.setData().
        },
        data: function () {
            // Some stuff that just fetches vars from this.data,
            // sets the relevant data attribute and also sets an
            // attribute on the span created by CKEditor since
            // styling and ::before content is used to show who
            // the block is visible to - the result is much like
            // the Show Blocks plugin. This stuff all works
            // correctly and being omitted changes nothing.
        }
    } );

CKEDITOR.dtd.restrict={
a:1，缩写：1，地址：1，区域：1，文章：1，旁白：1，音频：1，b:1，bdi:1，bdo:1，blockquote:1，
br:1，按钮：1，画布：1，引用：1，代码：1，命令：1，数据列表：1，删除：1，详细信息：1，dfn:1，div:1，
dl:1，em:1，嵌入：1，字段集：1，图：1，页脚：1，表格：1，h1:1，h2:1，h3:1，h4:1，h5:1，h6:1，
标题：1，hgroup:1，hr:1，i:1，iframe:1，img:1，输入：1，ins:1，kbd:1，keygen:1，标签：1，映射：1，
mark:1，meter:1，noscript:1，object:1，ol:1，output:1，progress:1，p:1，pre:1，q:1，ruby:1，s:1，
samp:1，script:1，section:1，select:1，small:1，span:1，strong:1，sub:1，sup:1，table:1，
文本区域：1，时间：1，u:1，ul:1，“变量”：1，视频：1，wbr:1，“#”：1
}; // 允许作为有效标记。
CKEDITOR.dtd.$block.restrict=1；
CKEDITOR.dtd.$inline.restrict=1；
CKEDITOR.dtd.$blockLimit.restrict=1；//将其视为块限制器标记
CKEDITOR.dtd.$removempty.restrict=1；//如果标记为空，请删除它们
CKEDITOR.dtd.$transparent.restrict=1；//就内容模型而言，将标记视为透明的
CKEDITOR.dtd.body.restrict=1；//允许它出现在主体、div和p标签中。
CKEDITOR.dtd.div.restrict=1；
CKEDITOR.dtd.p.restrict=1；
var allowedEls=['restrict']；
for（CKEDITOR.dtd.restrict中的变量i）{
if（CKEDITOR.dtd.restrict.hasOwnProperty（i）&&i！='#'）{
允许推力（i）；
}
}
//定义小部件。
editor.widgets.add（'restrict'{
按钮：“受限内容”，
对话框：“restrictDialog”，
模板：“”，
可编辑：{}，
allowedContent:allowedEls.join（“”）+'[*]{*}（*），//上述所有元素，以及任何属性、样式或类。
requiredContent:“限制[data-*]”，
上行：功能（元素）{
return element.name==“restrict”；
},
init：函数（）{
//一些东西在各种
//我关心的属性，从数据中获取
//属性并推送到这个.setData（）。
},
数据：函数（）{
//一些东西只是从这个数据中获取变量，
//设置相关的数据属性，并设置
//由CKEditor创建的跨度上的属性
//样式设置和：：在内容用于显示谁之前
//块是可见的-结果非常类似
//显示阻止插件。这些东西都能用
//正确地说，省略不会改变任何事情。
}
} );

我猜我设置的

editables

不正确，可能是这个标签的一般允许内容，但我不知道我应该如何创建这样一个标签，我无法想象创建这样一个虚拟标签将在浏览器之外解析会是一个新问题

---

提前谢谢

事实上，我找到了这个问题的另一个答案，主要是重新定义了这个问题

首先，我意识到CMS几乎所有的时间都在限制内容，它将在块上下文中而不是在内联上下文中进行限制——整个div部分将被删除，而不是一行的一部分

一旦我意识到这一点，我就意识到我需要构建的不是一个真正的小部件，而是一个更传统的插件

然后，我开始为CKEditor使用insertdiv插件，并开始根据需要对其进行定制。在插件的init方法中，有以下初始设置：

CKEDITOR.dtd.restrict = {};
CKEDITOR.tools.extend(CKEDITOR.dtd.restrict, CKEDITOR.dtd.div);
CKEDITOR.dtd.$block.restrict = 1;
CKEDITOR.dtd.$blockLimit.restrict = 1; // Treat <restrict> as a block limiter tag
CKEDITOR.dtd.$removeEmpty.restrict = 1; // Remove <restrict /> tags if they are empty
CKEDITOR.dtd.body.restrict = 1; // Allow it in the body, div and p tags.
CKEDITOR.dtd.div.restrict = 1;

CKEDITOR.dtd.restrict={}；
CKEDITOR.tools.extend（CKEDITOR.dtd.restrict，CKEDITOR.dtd.div）；
CKEDITOR.dtd.$block.restrict=1；
CKEDITOR.dtd.$blockLimit.restrict=1；//将其视为块限制器标记
CKEDITOR.dtd.$removempty.restrict=1；//如果标记为空，请删除它们
CKEDITOR.dtd.body.restrict=1；//允许它出现在主体、div和p标签中。
CKEDITOR.dtd.div.restrict=1；

这在很大程度上满足了插件的需求，但我使用的是一个预构建的CKEditor副本，我既没有时间也没有意愿建立一个重建/重新整合CKEditor的过程，这在这里是一个问题，因为

$blockLimit

仅在启动时使用，而在插件级别添加到它是不起作用的，因为在加载插件之前已经运行了它的唯一评估时间。为了解决这个问题，插件会在插件运行后克隆CKEDITOR.dom.editorPath的闭包和定义，以便正确地重新计算DTD方法

除此之外，我将所有“creatediv”/“editdiv”/“removediv”引用适当地更改为“*restrict”，将检查“div”的位置更改为“restrict”，并用dialo替换对话框定义