Wordpress

Question

我已经建立了一个前端网站，现在我正在使用 html5blank 主题上传到 wordpress。我以前从未上传过自定义字体文件，我想我弄错了文件路径。字体文件位于我的子主题文件夹中的字体文件夹中。这就是我的代码 -

style.css

@font-face {
    font-family: 'Gotham-Light';
    src: url('/fonts/Gotham-Light.otf') format('opentype');
    font-weight: normal;
    font-style: normal;

}

我也把它放在我的 header.php 中（不确定是否需要）-

 <link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri() ?>/fonts/Gotham-Light.otf" />

如果这是问题所在，我该如何显示正确的路径？可以是相对的还是必须是绝对的？

Answer 1

这应该可行，只需将字体放入主题目录中名为 fonts 的文件夹中即可。

@font-face {
font-family: 'gothamlight';  
src: url(http://www.example.com/wp-content/themes/your-theme/fonts/Gotham-Light.otf);  
font-weight: normal;
font-style: normal;

}

Answer 2

您在此处的@font-face 中使用了绝对路径：

src: url('/fonts/Gotham-Light.otf') format('opentype');

开头的/表示在webroot中寻找字体

假设您的 style.css 在您的子主题文件夹中，而 fonts 是它的子文件夹，试试这个（即开头没有 /）：

src: url('fonts/Gotham-Light.otf') format('opentype');

Answer 3

您需要字体文件的地址，而不是样式表。

 <link rel="stylesheet" href="<?php echo get_template_directory_uri('/fonts/Gotham-Light.otf') ?>/fonts/Gotham-Light.otf" />

Wordpress - 通过 font-face 添加自定义字体

Wordpress - adding a custom font via font-face

css

php

fonts

font-face