TinyMCE 主题伪类。允许通过 ThemeManager 注册时使用自定义主题与 TinyMCE 一起使用。

这是一个描述如何为 TinyMCE 创建自定义主题的伪类。

有关 ThemeManager 实例上可用方法的更多信息,请参阅 AddOnManager。

警告:TinyMCE 的大部分功能由默认的 Silver 主题提供。创建自定义主题可能需要重新实现此功能。要更改 TinyMCE 的外观,Tiny 建议改用更改 Skin 的方式。

示例

tinymce.ThemeManager.add('MyTheme', (editor) => {
  // 在 dom 中设置自定义 UI 元素
  const div = document.createElement('div');
  const iframe = document.createElement('iframe');
  document.body.appendChild(div);
  document.body.appendChild(iframe);

  // 创建好 UI 并加载完所有样式表后,主题应触发 SkinLoaded 事件。
  editor.on('init', () => {
    editor.fire('SkinLoaded');
  });

  // 主题必须返回一个 renderUI 函数,该函数返回 editorContainer。如果编辑器未以 inline 模式运行,则还应返回 iframeContainer。
  const renderUI = () => {
    return {
      editorContainer: div,
      iframeContainer: iframe
    };
  };

  // 返回 renderUI 函数
  return {
    renderUI: renderUI
  };
});