在 WordPress 中使用 Google 字体非常简单。这是一个包含 800 多种网络字体的免费目录，您可以在网站上使用这些字体。谷歌字体服务是一项顶级免费服务，数百万 WordPress 网站使用它来增强网站的外观和可用性。下面介绍如何在 WordPress 上使用 Google 字体，同时不影响网站性能并提高PageSpeed分数。
方法 1：在 WordPress 服务器上托管 Google 字体
步骤 1：选择 Google 字体
使用更少的 Google 字体将减少请求（更少的字体 = 更少的请求）。
谨慎选择字体权重-- 使用的字体权重数量也会影响页面加载速度。为确保 Google Fonts 只加载您需要的权重，请取消选中其他权重，以便只加载您需要的结果。
步骤 2：下载字体
下载字体是整个过程的第二步。需要注意的是，Google 会自动下载所有字体权重，因此在此阶段无需选择字体权重。第三步才需要选择字体权重。
步骤 3：将字体转换为网络字体
点击网站上的 "添加字体 "按钮，只选择您将在网站上使用的字体，然后上传。这是一个roboto-regular.ttf文件和一个roboto-bold.ttf文件，因此包含了两种重量的字体。由于 WOFF 和 WOFF2 涵盖了所有重要的浏览器，因此请保持设置不变。单击 "转换 "按钮开始转换过程。
步骤 4：下载转换后的字体文件
字体转换完成后，您就可以下载它们了。由于我们已将两个字体下载到电脑上，因此压缩文件中总共会有 4 个字体文件（由于我们下载了两个字体，因此压缩文件中会有 4 个字体文件）。
第 5 步：将字体文件上传到 WordPress 文件中
请确保通过 FTP 或cPanel 上传网页字体文件，最好放在 wp-content/uploads 文件夹中，以免被主题和核心更新覆盖。我们将字体上传到 "fonts "文件夹（这样它们就与其他文件分开了）。在浏览器中打开链接后，您就可以下载字体了，这样您就可以确认字体已成功上传。
第 6 步：在 CSS 中添加自定义字体
下载压缩文件后，我们将在文件中添加 stylesheet.css CSS。下面的 CSS 代码会将字体连接到现有的 CSS 中，并使其可用。
您可以将 CSS 代码放在 functions.php 中，也可以从 style.css 文件开始。在 CSS 代码中可以使用外部 CSS 文件或 WordPress 的 wp_enqueue_style 函数。我们将在主题的默认 style.css 文件中粘贴 CSS 代码。将代码复制/粘贴到样式表中，将相对 URL 替换为绝对 URL。
stylesheet.css 中的主题默认 URL：
src: url('Roboto-Bold.woff2') format('woff2')、
url('Roboto-Bold.woff') format('woff')；
改为：
src: url('https://demo.com/wp-content/uploads/fonts/Roboto-Regular.woff2') format('woff2')、
url('https://demo.com/wp-content/uploads/fonts/Roboto-Regular.woff') format('woff')；
要在当前 HTML 中轻松使用字体，请创建一个自定义类。CSS 类roboto_font和 robot_bold_font。
.roboto_font {
font-family："Roboto", "Arial", sans-serif; }
.roboto_bold_font {
font-family："Roboto", "Arial", sans-serif；
font-weight: bold；
}
第 7 步：设置默认字体
要将此字体设为网站的默认字体，必须在 style.css 文件中加入 CSS 代码。
您可能需要调试或编辑字体，以替换现有的字体属性。
下一步是将获得的 stylesheet.css 文件上传到名为 stylesheet.css 的文件中，并添加 CSS。下面的 CSS 代码将使字体与现有 CSS 配合使用，只要输入即可使用。您可以使用外部样式表或 WordPress 函数 wp_enqueue_style 来调用样式表。
方法 2：预载网络字体--折叠上方优化
如果您使用的是 Google 字体，您可能需要参考由 Google 制作并从 Google 服务器发送到 WordPress 网站的样式表。使用 Google Chrome 浏览器提供的开发工具检查网站时，您可能会看到幕后的过程。你可能会在 Source 中看到两个 Google 字体的条目。
请参阅此处附带的图片。
当您点击fonts.googleapis链接时，您会发现在打开的页面上显示了您生成 URL 的样式表。此外，每个 font-face 声明都会调用特定的字体文件。
这表明，如果使用不同的字体权重，用户必须访问fonts.gstatic.com，以获得字体所需的权重。这一步骤可能会延长 WordPress 页面的加载时间。
因此，请访问当前主题的 functions.php 文件，并在负责管理字体的函数中输入以下 PHP 代码。
function twentyeleven_resource_hints( $urls, $relation_type ) {
if ( wp_style_is( 'rumi-fonts', 'queue' ) && 'preconnect' === $relation_type ){
$urls[] = array(
href' => 'https://fonts.gstatic.com'、
交叉原产地
);
}
返回 $urls；
}
add_filter( 'wp_resource_hints', 'twentyeleven_resource_hints', 10, 2 )；
方法 3：使用插件优化 Google 字体 WordPress
与大多数 WordPress 相关的工作一样，插件可以让 Google 字体的优化工作变得更加简单。此外，它们还能为你解决软件方面的问题，因此你不必担心代码在系统中的位置。
如果您在 WordPress 网站上安装了 Google 字体，并使用 PageSpeed Insights 或 GTmettrix 进行性能测试，您会收到以下错误信息：fonts.googleapis.com.
出现这种情况是因为 Google 字体与 WordPress 平台不兼容。这表明您的 WordPress 网站需要对 Google 字体进行优化。
可以使用一个免费插件来固定相同的字体。它就是 -OMGF | 本地托管谷歌字体
完成安装后，插件会立即开始将 WordPress wp en queue script()Google Fonts 方法切换到 wp head() 函数。该插件可自行完成所有操作。
在Seahawk Media 上查找更多此类文章。
