第26章 FontAwesome 图标集成指南

版本：2.xFontAwesome 图标 Flarum 全站界面使用 FontAwesome 图标。默认捆绑的是 Free 版本，由你自己的服务器提供。你可以切换到 CDN 托管的样式表或 FontAwesome Kit，以解锁 Pro 图标、自定义图标等功能。 当前使用的来源可以在管理后台的「高级」页面修改，也可以直接在 config.php 中配置。 来源 本地（默认） Flarum 自带 FontAwesome Free，并在安装时以及每次执行以下命令时，将 webfont 发布到 public/assets/fonts/： php flarum assets:publish 不会发起任何外部请求，仅提供 Free 图标集（fas、far、fab）。 对大多数站点来说，这是推荐的默认方案。 升级 Flarum 后 如果你升级 Flarum 后新版本自带的 FontAwesome 版本不同，public/assets/fonts/ 中的旧字体文件不会被自动删除。请清空该目录并重新发布： rm -rf public/assets/fonts php flarum assets:publish CDN 通过提供 CSS 链接，从第三方 CDN 加载 FontAwesome。这会完全取代本地的样式表和 webfont——服务器上不再发布任何字体文件。 在 config.php 中： 'fontawesome' => [ 'source' => 'cdn', 'cdn_url' => 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.0/css/all.min.css', ], cdn_url 可以指向任何兼容的 FontAwesome 样式表，包括托管在私有 CDN 上的 Pro CSS 文件。 Kit FontAwesome Kit 是在 FontAwesome 官网上配置的个性化资源包。Kit 通过一段 JavaScript 代码加载，可以解锁 Free 版本不具备的功能： Pro 图标——涵盖 Solid、Regular、Light、Thin 和 Duotone 风格的数千个额外图标 自定义图标——上传自己的 SVG，像普通 FA 图标一样使用 图标上传——直接在 FontAwesome 控制台管理图标 要使用 Kit，请先在 fontawesome.com/kits 创建一个，然后在 config.php 中添加 Kit 链接： 'fontawesome' => [ 'source' => 'kit', 'kit_url' => 'https://kit.fontawesome.com/YOUR_KIT_CODE.js', ],

该 Kit 的 URL 可在 FontAwesome 后台的 Kit 页面中找到。

注意

Kit 脚本从 FontAwesome 服务器加载。这意味着每次页面加载时，用户浏览器都会向 kit.fontawesome.com 发起请求。如果你有严格的数据驻留要求，请改用 CDN 或本地资源。

图标类名

Flarum 使用 FontAwesome 7。图标类名遵循“样式 图标”的命名模式：

• Solid：fa-solid fa-house（旧别名 fas fa-house 也有效）
• Regular：fa-regular fa-envelope（旧别名 far fa-envelope 也有效）
• Brands：fa-brands fa-github（旧别名 fab fa-github 也有效）
• Light (Pro)：fa-light fa-house（旧别名 fal fa-house 也有效）
• Thin (Pro)：fa-thin fa-house（旧别名 fat fa-house 也有效）
• Duotone (Pro)：fa-duotone fa-house（旧别名 fad fa-house 也有效）

旧版简写别名（如 fas、far、fab 等）完全受支持，无需修改。新代码可使用任一风格。

可访问 fontawesome.com/icons 浏览免费图标目录。

FA7 中的重命名图标

FontAwesome 7 重命名了部分图标。FA7 自带的 CSS 别名仍使旧名称可用，因此不会导致现有功能失效。但在编写新代码或更新现有扩展时，建议优先使用当前的标准名称。

Flarum 核心及内置扩展中使用的以下 FA5/FA6 图标名称在 FA7 中已重命名：

• fa-cog → fa-gear
• fa-edit → fa-pen-to-square
• fa-ellipsis-h → fa-ellipsis
• fa-exclamation-triangle → fa-triangle-exclamation
• fa-file-alt → fa-file-lines
• fa-search → fa-magnifying-glass
• fa-sync / fa-sync-alt → fa-arrows-rotate / fa-rotate
• fa-times → fa-xmark
• fa-times-circle → fa-circle-xmark
• fa-trash-alt → fa-trash-can
• fa-user-edit → fa-user-pen
• fa-vote-yea → fa-check-to-slot

上述所有图标均未变更样式前缀（如 fas、far 等）。

完整的变更列表请参阅 FontAwesome 升级指南。

扩展开发

从扩展注册图标时（例如在 composer.json 或设置注册中），请使用完整的类名字符串：

"icon": "fas fa-puzzle-piece"

扩展无需自行捆绑 FontAwesome——它由 Flarum 核心提供，且在每个页面上均可用。