Apex 23.1中TinyMCE添加带URL引用的自定义字体失败求助

你遇到的问题主要由重复初始化TinyMCE、字体格式定义错误及内容样式配置不当导致，以下是具体修复步骤：

1. 合并TinyMCE初始化配置 #

不要分开调用两次tinymce.init()，所有配置项需放在同一个初始化对象中，否则后一次初始化会覆盖前一次的部分设置。

修正后的初始化JavaScript代码：

tinymce.init({
  // 保留你原有的其他配置项...
  font_formats:
    "Andale Mono=andale mono,times; Arial=arial,helvetica,sans-serif; Arial Black=arial black,avant garde; Book Antiqua=book antiqua,palatino; Comic Sans MS=comic sans ms,sans-serif; Courier New=courier new,courier; Georgia=georgia,palatino; Helvetica=helvetica; Impact=impact,chicago; Oswald=oswald; Symbol=symbol; Tahoma=tahoma,arial,helvetica,sans-serif; Terminal=terminal,monaco; Times New Roman=times new roman,times; Trebuchet MS=trebuchet ms,geneva; Verdana=verdana,geneva; Webdings=webdings; Wingdings=wingdings,zapf dingbats; Peyda=Peyda",
  content_style: `
    @font-face {
      font-family: 'Peyda';
      src: url('#WORKSPACE_FILES#Peyda-Regular.ttf') format('truetype');
    }
  `
});

关键修正点： #

• 将font_formats和content_style合并到同一个tinymce.init对象中
• font_formats里的新增字体项前添加分号+空格（原代码最后一项;peyda=peyda缺少空格，会导致TinyMCE无法识别）
• 字体名称保持大小写一致（Peyda=Peyda对应@font-face中的'Peyda'）

2. 保留并验证内联CSS配置 #

保留页面内联CSS的@font-face定义，确保主页面和TinyMCE的iframe都能加载字体：

@font-face{
  font-family:'Peyda';
  src:url('#WORKSPACE_FILES#Peyda-Regular.ttf') format('truetype') !important;
}

3. 验证字体加载状态 #

完成上述修改后，需确认以下几点：

• Peyda-Regular.ttf已正确上传到Apex工作区文件，且访问权限设置为公开或当前用户可访问
• 打开浏览器开发者工具的「Network」标签，刷新页面后检查字体文件是否成功加载（无404或权限错误）
• 查看页面源代码，确认#WORKSPACE_FILES#已被Apex正确替换为实际的文件URL

完成以上操作后，Peyda字体应能出现在TinyMCE的字体选择器中，并正常应用到编辑器内容里。

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