TYPO3 v12中CKEditor 5自定义图标字体无法加载问题求助

安全阿岳

2026-7-19

TYPO3 v12 中 CKEditor 5 自定义图标字体加载问题处理

TYPO3 v12 版本里，所有资源统一归集到 _assets 文件夹，资源路径规则发生了变更
CKEditor 5 的样式定义方式已经更新，之前能正常使用的自定义图标字体加载逻辑不再适配当前版本
图标字体无法加载的核心原因基本是路径配置错误，需要针对新的资源结构调整路径配置

排查与修复步骤：

确认图标字体文件已被正确归集到 _assets 目录下，检查文件是否存在、路径是否匹配

修改 CKEditor 5 的样式定义，将字体引用路径调整为基于 _assets 的相对路径或绝对路径，示例代码：

@font-face {
  font-family: 'CustomIcons';
  src: url('../_assets/fonts/custom-icons.eot');
  src: url('../_assets/fonts/custom-icons.eot?#iefix') format('embedded-opentype'),
       url('../_assets/fonts/custom-icons.woff2') format('woff2'),
       url('../_assets/fonts/custom-icons.woff') format('woff'),
       url('../_assets/fonts/custom-icons.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}