今天我们分享下比较实用的 WordPress 主题修改全局字体详细教程，有时候 WordPress 的字体不能让我们满意，这个时候我们就可以通过一些方法来修W y 8 I F l 5改主题的默认字体，来达到我们想要的效果。下面介绍的更换字体主要分为两种，第一种是直接调用系统的字体，来替换原来主题的默认字体；第二种则是使用p : Z [ *自己的字体文件，来实现字体的替换。
第一种：
这种方法通过修改 CSS 文件就可以实现，有些主题自带( d & B & T了自定义 CSS 样式的\ 5 d设置，Wordpress 也提供了这一入口（后台管理 -&gP Z it; 外观 -> 自定义 CSS），这时候我们就可以直接在里面填上：
- *:not( e B _ w1;clF Z % u = -ass*="_ q i |icon"]):not(i&6 z 6 | D | B h#041; {
- font-family: Segoe UI, &qD 4 `uot;Microsoft Yahei" !important;
- }
上面的例子就是将字体全局优先替换成 Segio UI，其次替换成微软雅黑，下面列举几个比较适合阅读的字体~ } ~ | 3，供大家替换，替换代码中的 Segio UI 和 MicrosoS u O 5ft YaHei 即可。C F r N f _
第二种：
既然是私有字体，那就一定无法D 8 W d j o从公共库中直接选择，必定要上传到某7 / { F [ b个服务端来进行E : _ X z r加载。这里可以选择：1. 上传至网站服务器 2.7 L 3 9 上传至 Github（推荐）3. 上传至私有云存储进行调用在这之前需要先做一/ G T 4 \ _ e项准备工作，我们手上的字体文件i n O ` i i b T通常只有一种格式，而为了满足不同浏览器的需要，我们需要g A \ m g将其扩展为五种格式，分别为.ttf .eot .woff .woff2 .svg。百度搜索就可以找到在线转换的工具，例如这个：在线字体转换
1、这种方法面临这一种风险，中文字体库体积通常很大，比如我现在正在使用的思源黑体，一个 ttf 文e # G : j 1 x T W件就有 8M 多，再a v p a加上国内服务器的小带宽，肯定导致网站加载时间大大加长。
将你前面准备好的五种字体格F a F T 5 N 2 ^ 9式全z & # `部上传到网站的一个文件夹内，比如我放在 /fonts 文件夹内，且统一命名，比如 siyuan.ttf,siyuan.svg 等等。在自定义 CSS 样式中输入下列代码：
- @font-face {
- font-family: '随便一个名称，需要和下面的保持对应';
- src: url('../fonts/yourfo9 Q ( \nt.eot');
- src:
- url('../fonts/yourfont.eot') fow i srmat('embedded-opentype'),
- url` s 8 V X Q %('../font[ 1 E S X A #s/yourfont.woff2') format('woff2'),
- url('x T e y a z p b../fonts/yourfont.wof1 | i L 2 7 af') format('woff'),
- urlB Y 2 S A040;d K 5 ] W { p O T'y S ~ @ 8 i../fonts/yourfG U R ? % O M pont.ttf') format('truetype'),
- url('../fonts/yourfont.V N !svg') format('svg'O n D 7 f O P #041;;
- font-weight:[ & 0 ? Y 2 normal;
- font-style: normaG : B w o 0 Q r #l;
- }
- *:not([class*="icon"]):not(i) {
- font-family: "与上面起的K d M 5 @ 2名字的对应&qu: h s g oot; !important;
- S / V | q5;
个人不是很推荐这种方法，建议还是使用下面的云存储托管。
2. 上传至 Github 使用免费的 jsDelivr CDN 加速，jsDelivr 如何如何好用这边就不多说了，Github 怎么使用这边也不多说了，大体方法就是将你的字体文件上传至 Github 自己] ~ # D ; 5 G q的仓库中，然后使用 jsDelivr 提供的加速服务来调用，方便好用还不要钱。
jsDelivK 0 u R 5 ; ; O Nr 调Q f d ^ W l 2 : l用格式 https://cdn.jsdelivr.net/gh/Github 用户名 / 仓库名 / 具体路径 svg 文件大多会超过 20M，评论区小伙伴提醒 jsDelivr 调用文件A \ 7 y @超过 20M 会报错，可W ; - { .以使用其他方式加载 svg，不过留在上面也没什么问题，因为正常是不会使用到的。附上几个字体的调用链接H . a G F X t（托h Y & _ Y V l C管于 Github，使用 jH u 2sDelivr 加速服务）：
AdobeCleanHanSC
- @font-face {
- font-family: 'AdobeCleanHanSC';
- src: url(c j 4 2'https://cdn.jsdel] @ @ C r W _ 9ivr.net/gh/Ratodo/Lib/fo5 f \ y Qnts/AdobeCleanHanSC/AdobeCleanHanSC.eot');
- src:
- url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AdobeCleanHanSC/AdobeCleanHanSC.eot') foN 9 o g w n / 2rmat('embedded-opentype'),
- url1 G L A }('https://cdn.jsdelivr.net/gh/Ratodo/Lib/? w u ^ x w * zfon@ n qts/AdobeCleanH~ N ` \ { SanSC/AdobeCleanHanSC.woff2') format('woff2'),
- url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AdobeCleanHanSC/Ado3 0 r d @ i { } &beCleanHanSC.woff') format('woff'),
- url('5 V p ? b %https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/A! l = ` 3 z G 3 (dobeClel : f Z \ vanHanSC/AdobeCleanHanSC.ttf') format('tr) F y U % :uetype'),
- url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AdobeCleanHanSC/AdobeCleanHanSC.svg') format('svg');
- fonO B | ~ 9 1 e tt-weight: 400;
- font-style: normal;
- font-display: swh o z Xap;
- }
- *:not([class*="icon"]):not@ a F - ( k0;i) {
- font-famid * cly:B 7 B G "AdobeCleanHanSC" !important;
- }
思源黑体
- @font-face {
- font-family: 'siyuan';
- src: url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/siyuan & un/siyuan.eot');
- src:
- url('https://cdn.jsdelivr.T X 5 I K ) / 7netQ r X [ 0 3 Z u/gh/Ratodo/Lib/fonts/siyuan/siyuan.eot') format&E [ k E a n ~ Z x#040;'embedded-opentype'),
- url('https://cdn.jsdelivr.ne3 ) x 7 h A !t/gh/Ratodo/Lib/fonts/siyuan/siyuan.woff2') format('woff2'),
- url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/siyuan/siyua} ` @ , K T e g Rn.woff') format('woff'),
- ub - h jrl('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/siyuan/siyuan.ttf') format('truetype'),
- url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/siyuan/siyuan.svg') format('svg');
- font-weight: 400;
- font-style: normal;
- font-display: swap;
- }
- *:not([class*_ o m # W j W=&q/ ] ( % z {uot;icon"& H 9 t&; i ^ w#093J s w Z t J;):not(i) {0 ( {;
- font-family: "siyuan" !iW b S [mportant;
- }
筑紫 A 丸
- @font-fah ) I J +ce {
- fD C ( 7 | ! m a Gont-family: 'AWan';
- src: url ('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AZ S CWan/Awan.eot');
- src:
- url('https://cdn.jsdelivr.net/gh/RaR T n m \todo/Lib/fonts/AWan/AWa/ + [ Wn.eot') format('embedded-opentypeg g l'),
- url 5 } N x - A X %l('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AWan/AWan.woff2') for$ [ Bmat('woff2'),
- urlA w 5 u C040;'0 P c _ ? chttps://cdn.jsdelivr.net/gh/Ra* Z ! o /todo/L\ 6 i e ~ 0 ! F 3ib/fonts/AWan/AWan.woff') format('w9 h . } 8 / 4 poff'),
- url, 5 ;040;'https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AWan/AWan.ttf') format('truetype'),
- url('https://cdn.jsdelivr.net/gh/Ratodo/Lib/fonts/AWanf ? T B/AWan.svg') format('svg'b S p K041;;
- font-weight: normal;
- font-style: normal;
- font-display: s$ F Vwap;
- }
- *:not ([class*="icon"]):not B E 9040;i) {
- font-family: "AWan" !important;
- &7 k $ } 6#125;
