迅睿CMS字体图标不显示问题 零基础可落地完整实操修复指南

问题常见诱因梳理

迅睿CMS字体图标不显示，90%以上的情况都是以下四类原因导致：字体文件丢失、引用路径错误、Web服务器拦截字体请求、跨域/权限限制，我们按照从易到难的顺序一步步排查修复，每一步都可以直接操作落地。

第一步：确认字体文件是否完整存在

首先检查核心字体文件有没有丢失，迅睿CMS默认字体文件存放在两个固定目录：

• 前台主题字体：/statics/css/fonts/，需要包含eot、svg、ttf、woff、woff2五种格式文件
• 后台管理字体：/dayrui/statics/fonts/，同样需要包含上述五种格式文件

如果对应目录为空或者文件不全，可以直接从官方仓库下载完整字体包，下载地址：https://gitee.com/xunruicms/xunruicms/tree/master/statics/css/fonts，下载整个目录后上传到对应位置即可。

第二步：修复引用路径错误问题

网站搬迁、更换域名、修改入口文件后，最容易出现路径错误，分前台和后台两种场景修复：

前台模板字体路径修复

打开模板目录下的图标CSS文件，找到类似下面的@font-face配置，默认的相对路径经常出错，我们直接改成绝对路径：

修改前示例（错误通用格式）：

``` @font-face { font-family: 'iconfont'; src: url('../fonts/iconfont.eot'); src: url('../fonts/iconfont.eot?iefix') format('embedded-opentype'), url('../fonts/iconfont.woff2') format('woff2'), url('../fonts/iconfont.woff') format('woff'), url('../fonts/iconfont.ttf') format('truetype'), url('../fonts/iconfont.svgiconfont') format('svg'); font-weight: normal; font-style: normal; } ```

修改后（可直接复制，替换域名即可）：

``` @font-face { font-family: 'iconfont'; src: url('https://你的域名/statics/css/fonts/iconfont.eot'); src: url('https://你的域名/statics/css/fonts/iconfont.eot?iefix') format('embedded-opentype'), url('https://你的域名/statics/css/fonts/iconfont.woff2') format('woff2'), url('https://你的域名/statics/css/fonts/iconfont.woff') format('woff'), url('https://你的域名/statics/css/fonts/iconfont.ttf') format('truetype'), url('https://你的域名/statics/css/fonts/iconfont.svgiconfont') format('svg'); font-weight: normal; font-style: normal; } ```

注意：把代码里的`你的域名`替换成你自己的实际域名，不需要加末尾斜杠

后台管理字体路径修复

后台字体路径是系统配置的，不需要改代码，操作步骤：

1. 登录迅睿CMS后台，依次点击进入系统设置 -> 站点设置 -> 静态资源地址
2. 将静态资源地址修改为你的实际地址，格式为：https://你的域名/，末尾必须保留斜杠
3. 保存配置，刷新后台页面即可

第三步：修复Web服务器拦截问题（绝大多数用户卡在这里）

配置伪静态后，很多Web服务器会默认拦截字体文件请求，导致返回404，分Nginx和Apache两种场景修复：

Nginx服务器修复步骤

打开你的Nginx站点配置文件，找到静态资源匹配规则，修改成以下内容，新增字体后缀和跨域头：

``` location ~ ^.+\.(ico|gif|jpg|jpeg|png|eot|svg|ttf|woff|woff2)$ { expires 30d; access_log off; add_header Access-Control-Allow-Origin ; } ```

确认伪静态规则符合官方要求，迅睿CMS正确的Nginx伪静态规则如下：

``` location / { if (!-f $request_filename){ rewrite ^/(.)$ /index.php?s=$1 last; break; } } ```

修改完成后，执行以下命令重载Nginx配置生效：

``` systemctl reload nginx ```

Apache服务器修复步骤

打开网站根目录下的.htaccess文件，在所有规则的最顶部添加以下MIME类型配置：

``` AddType application/vnd.ms-fontobject eot AddType font/opentype otf AddType font/truetype ttf AddType application/x-font-woff woff AddType application/x-font-woff2 woff2 AddType image/svg+xml svg ```

保存文件后直接刷新页面即可生效，不需要重启Apache服务。

第四步：修复跨域和权限问题

如果你的静态资源放在CDN或者单独的静态域名下，会触发浏览器跨域限制，修复方法：

• CDN端：在CDN控制台的HTTP响应头配置中，添加Access-Control-Allow-Origin: 即可
• 源站端：前面的Nginx/Apache配置已经自动添加了该头，不需要额外修改

Linux服务器下如果目录权限错误，会导致无法读取字体文件，执行以下命令修改权限，将路径替换成你自己的网站根目录即可：

``` chmod -R 755 /www/wwwroot/你的网站根目录/statics/css/fonts chmod -R 755 /www/wwwroot/你的网站根目录/dayrui/statics/fonts ```

最终验证：清除缓存查看结果

所有修改完成后，按顺序清除缓存：

1. 进入迅睿CMS后台，点击更新缓存，全选所有缓存类型后点击更新
2. 清除浏览器缓存，或者按Ctrl+F5强制刷新页面

如果仍然不显示，可以按F12打开浏览器开发者工具，查看报错信息对症调整：返回404重新检查路径配置，返回403重新修改目录权限，显示跨域错误重新检查CORS头配置即可。