为什么我不能让 @font-face 为 wordpress 处理自定义字体？

Question

我正在使用 wordpress，发现无法让我的自定义字体在我的网站上运行。我已经查看了几个具有相同问题的线程，但没有一个解决方案有效，或者我错误地应用了它们。我使用了一个我正在修改的免费主题。我正在编辑 style.css 工作表，但不知道我做错了什么。有些字体可以在我的电脑上找到（有些则不能，即使它们可以在我的电脑上找到），所以似乎发生了一些非常奇怪的事情。 @font-face 的所有东西都不能在其他设备上运行。

我使用字体松鼠制作了一组网络字体并将它们上传到我的服务器，在单独的字体文件夹中的主题下。这些文件应该是可访问的，因为权限被授予用户、组、世界以进行读取和执行。我现在还尝试使用添加了完整地址的字体松鼠提供的代码来实现字体。什么都没有发生。

现在这是我开始编码的第一天，所以我可能没有看到我在这里做错了什么。我在样式文件中的 HEADING-headline 之后插入了这个新代码（我不确定工作表中的定位是否会有所不同，或者是否只是为了用户的组织目的，但我已经尝试了几个），这是文件上的条带：

.blog-title {
    font-family: "daniel_blackregular";
    font-size: 2.25em;
    text-align: center;
}

@font-face {
    font-family: 'daniel_blackregular';
    src: url('/public_html/wp-content/themes/baskerville/Fonts/danielbk.eot');
    src: url('/public_html/wp-content/themes/baskerville/Fonts/danielbk.eot?#iefix') format('embedded-opentype'),
         url('/public_html/wp-content/themes/baskerville/Fonts/danielbk.woff2') format('woff2'),
         url('/public_html/wp-content/themes/baskerville/Fonts/danielbk.woff') format('woff'),
         url('danielbk.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

现在我在想如果我不正确地处理字体怎么办，但我也尝试了所有的方法。请帮忙。

Answer 1

要解决您的问题，您需要做一些事情。

1. 将 @font-face 移动到 css 文件的顶部。

2. 在您的 @font-face 调用中更新 url 路径。现在他们正在返回一个 404，其 url 为：

---

@font-face {
font-family: 'daniel_blackregular';
src: url('/fonts/danielbk.eot');
src: url('/fonts/danielbk.eot?#iefix') format('embedded-opentype'),
     url('/fonts/danielbk.woff2') format('woff2'),
     url('/fonts/danielbk.woff') format('woff'),
     url('/fonts/danielbk.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

---

请记住，网址是相对于呼叫来源的。在这种情况下，它会从您的 CSS 中调用。

当我将 css 中的路径更新为： src: url('/public_html/wp-content/themes/baskerville/Fonts/danielbk.eot');字体工作。