Drupal9中CKEditor5自定义标签被替换为data-ck-unsafe-element问题求助

针对你遇到的自定义<bbref>标签加载时被替换为<span data-ck-unsafe-element="bbref">的问题，核心原因是CKEditor5默认仅识别白名单内的元素，自定义元素需要在Schema中注册并配置正确的上下转换规则，同时配合Drupal的HTML过滤设置，具体步骤如下：

1. 在CKEditor5插件中注册模型Schema #

CKEditor5的Schema是编辑器识别合法元素/属性的核心，必须显式注册<bbref>：

init(editor) {
  // 注册<bbref>为行内文本元素，继承文本的所有特性
  editor.model.schema.register('bbref', {
    inheritAllFrom: '$text',
    allowAttributes: ['ver'], // 允许ver属性
  });
}

2. 配置Upcast（HTML→模型）转换规则 #

让编辑器能把保存的<bbref>HTML转换为模型中的对应元素：

editor.conversion.for('upcast').elementToElement({
  model: 'bbref',
  view: {
    name: 'bbref',
    attributes: {
      ver: true, // 匹配并保留ver属性
    },
  },
});

3. 修正Downcast（模型→HTML）转换规则 #

你之前使用createAttributeElement()是针对属性的转换，而<bbref>是独立元素，需改用元素转换：

editor.conversion.for('downcast').elementToElement({
  model: 'bbref',
  view: (modelElement, { writer }) => {
    const verAttr = modelElement.getAttribute('ver');
    return writer.createContainerElement('bbref', { ver: verAttr });
  },
});

4. 配置Drupal的HTML过滤规则 #

Drupal的文本格式过滤会影响保存/加载的HTML，需在对应文本格式（如Full HTML）的设置中：

• 进入配置>内容创作>文本格式和编辑器，选择你的编辑器配置
• 在“HTML过滤器”的“允许的HTML标签”中添加：<bbref ver>
• 确保CKEditor5的“限制HTML”功能没有屏蔽<bbref>

5. 额外排查点 #

• 检查Drupal CKEditor5模块是否有版本更新，部分版本可能对自定义元素的处理有调整
• 确认没有其他过滤模块（如Filter模块的额外规则）自动移除<bbref>标签

内容的提问来源于stack exchange，提问作者jons