为什么我不能在WordPress functions.php中排列多个谷歌字体？

Question

我正在使用wp_enqueue_style来对这个Google字体文件进行排队。这是我的代码：

wp_enqueue_style( 'google-fonts', 'https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,700;1,400&family=Neuton:ital,wght@0,300;0,400;0,700;1,400&display=swap', [] );

这在我的functions.php文件中。

但是，当我在加载的页面上查看源代码时，该字体文件的URL将被削减为：https://fonts.googleapis.com/css2?family=Neuton%3Aital%2Cwght%400%2C300%3B0%2C400%3B0%2C700%3B1%2C400&display=swap&ver=5.3.2

如您所见，第一个家族param在通过wp_enqueue_style输出后已经被删除。有没有办法解决这个问题而不做任何烦人的事？我认为可能有一种过时的方法来构建这两个字体家族的URL，但我更希望能够使用Google现在提供的内容。我在wp_enqueue_style中的原始网址是谷歌字体生成的供我嵌入的网址。

Answer 1

这实际上与PHP及其解析查询参数的方式有关。

https://www.php.net/manual/en/function.parse-str.php

无论如何，当前的解决方法是将"null“传递给version参数，使WordPress不向URL添加"ver”。

wp_enqueue_style( 'google-fonts', 'https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,700;1,400&family=Neuton:ital,wght@0,300;0,400;0,700;1,400&display=swap', [], null );

"null“结尾将消除问题，因为WordPress不会尝试向URL添加任何附加参数，因此不会通过PHP查询字符串处理函数来运行它。

这可能在未来的WordPress更新中得到更直接的解决。但是，在这些外部URL上没有版本是有意义的。

Answer 2

相同的查询参数定义了两次(family)，因此WordPress删除了一个查询参数。这在典型上下文中是正常的:如果存在重复查询参数，则只使用最后一个查询参数。WordPress在对URL进行排队时使用了这条“规则”。

我无法告诉您为什么Google字体将语法从|分隔符(如：https://fonts.googleapis.com/css?family=Montserrat|Neuton&display=swap)更改为这个重复的family参数，但看起来可能是因为您在URL中看到的复杂性。有一件事是肯定的:这会给你带来一些麻烦，就像你现在遇到的那样。要么WordPress需要对此进行调整，要么谷歌字体必须更新/恢复它们的URL语法。今天可能不会发生这种事。

在这种情况下，现在最好自己进行更改，使用经典站点(在Google字体导航栏中)来构建字体URL。我知道你不会有那么多的选项(看起来你在尝试使用可变字体，这太棒了！)，所以这有点令人失望。

您也可以下载这些文件并自行托管这些字体。在许多情况下，这也是一种性能提升。