子比主题美化系列（一）：更换网站字体

前言

Windows访问总感觉字体“怪怪”的，所以本篇文章记录一下如何给网站设置自定义字体。

使用教程

注：注意字体的版权，切勿侵权使用

1、获取字体

首先去网站查找并下载一些自己喜欢的字体，这里推荐两个：

• 100字体下载站
• 猫啃网
• 阿里巴巴普惠体3.0

2、转换字体

下载文件后，解压会得到一个.ttf或者.otf文件或者其他格式。然因有的格式的字体在部分浏览器不生效（如：.ttf的字体在Safari不生效）

所以，需要转换成eot,woff,woff2,svg其中一个就好。这里推荐.woff格式的

转换网址：https://convertio.co/zh/font-converter/

3、上传文件

上传文件到网站的根目录，也可以是其他位置。

总之，需要记住这个位置

例：https://www.kabll.com/wp-content/typeface/AlibabaPuHuiTi-3-55-Regular.ttf

上述链接：

​ 1、https://www.kabll.com/wp-content/typeface/替换成你自己的文件存放路径

​ 2、font.woff替换成你所下载或转换的文件名

4、添加CSS代码

注意修改url中的地址

如果要添加多个字体文件，你有可能需要注意代码规范;

以下代码添加到zibll主题>自定义代码>自定义CSS里。（实际修改后可压缩再放入，理论提高访问效率）

font-family: 'moe';
src:  url('https://www.kabll.com/wp-content/typeface/AlibabaPuHuiTi-3-55-Regular.ttf');
src:  url('https://www.kabll.com/wp-content/typeface/AlibabaPuHuiTi-3-55-Regular.woff');
}
body{
font-family:'moe';
}
.enlighter-default .enlighter{max-height:400px;overflow-y:auto !important;}.lazyloading:not(.swiper-lazy-loaded){opacity: 0;}@media (max-width:640px) {
    .meta-right .meta-view{
      display: unset !important;
    }
  }

效果展示

默认字体

修改字体