如何在WordPress中使用本地字体
问题情形
有很多时候,Wordpress 的字体不能让我们满意,这个时候我们就可以通过一些方法来修改主题的默认字体,来达到我们想要的效果。
解决方案
此次解决方案分为以下两种
- 直接CSS调用系统字体来实现更换字体
- 使用本地字体来更换字体
直接使用系统字体
使用系统字体通过修改 CSS 文件就可以实现,在(WP后台管理 -> 外观 -> 自定义 CSS),填入以下代码:
*:not([class*="icon"]):not(i) {
font-family: Segoe UI, "Microsoft Yahei" !important;
}
替换效果
字体全局优先替换成 Segio UI,其次替换成微软雅黑。
常用系统字体名称
- 宋体(SimSun)
- 微软雅黑(”Microsoft Yahei”)
- 华文黑体(STHeiti)
- 冬青黑体( Hiragino Sans GB )
- 苹方(PingFang SC)
使用本地字体
首先我们需要在WordPress根目录中新建一个Fonts文件夹(其他名字也行,方便后期调用)。
然后下载你需要的字体文件放到其中。
注意:
因为考虑到字体在浏览器的兼容问题,如果你下载的字体文件为TTF格式建议转换为WOFF 或 WOFF 2.0 格式。
如果下载不到WOFF格式的字体文件可以点击下方链接进行转换,然后放到上面新建的Fonts文件夹中。
字体调用
在(WP后台管理 -> 外观 -> 自定义 CSS)或者在主题的额外CSS中填入以下代码:
@font-face {
font-family: '随便一个名称,需要和下面的保持对应';
src: url('../fonts/字体文件.woff2');
src:
url('../fonts/yourfont.woff2') format('woff2'),
url('../fonts/yourfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
*:not([class*="icon"]):not(i) {
font-family: "与上面起的名字的对应" !important;
}
即可调用
其他方式
你可以使用website builder插件或者CAOS for Webfonts插件 实现字体更换
但是使用插件字体有很大的局限性,但是方便。具体方法看自己挑选。
如何在WordPress中使用本地字体
https://xsunhua.cn/759.html



Kaspa
怡然一记@Kaspa