好!很有精神,今天来把鸽了一年的Cuckoo模板自定义字体教程搓出来!
看到本站的左上角站名和正文用的不是一种字体对吧?这就是自定义字体!
(第一次自己写教程,不喜勿喷QAQ)
1.所需工具
1个好使的编辑器(例如vscode)
1个好使的脑子(别不清不楚等下写到一半不知道在写什么了啊喂)
所需字体的ttf文件(看你个人,我目前都使用的是ttf文件,其他后缀可以自行尝试,这里均已ttf为例)
2.准备工作
新建一个文件夹,把你想要的字体文件丢进去。
## 3.正式开工 ##
其实做法很简单,本质上和fonts.google.com一样
fonts.google.com上是选择你要的字体,然后他给你一个调用css的链接代码
我们的做法也是写一个css
@font-face {
font-family: '①可以随便起一个名,或者就用文件名';
src: url('②这里放ttf文件路径') format('truetype');
}
你可以按格式无限堆叠,反正我们就只塞字体样式而已。
下面是一个范例
@font-face {
font-family: 'xiangsuzi';
url('./xiangsuzi.ttf') format('truetype');
}
写完后记得保存,然后上传到网站(随便你放哪,记得网址就行,我css和字体都放cdn的所以和博客不放在一起)
4.在Cuckoo里调用
进入Cuckoo的主题设置,在右侧栏里点开高级设置,在最底部找到字体CSS链接、全局字体和LOGO字体三个输入框。
字体CSS链接填入上一步上传后的网址,全局字体就是网站全站使用的字体,LOGO字体就是网站左上角的网站名称字体。
注意!这里全局字体和LOGO字体填的内容是你想要调用字体的font-family名称!填完别忘记点保存!
现在,大功告成!返回你的主页查看效果吧!