如何将自定义字体添加到 WordPress 主题 - PHP

在 WordPress 的主题中，可以通过添加自定义字体来实现更好的视觉效果。本文将介绍如何将自定义字体添加到 WordPress 主题中，实现个性化定制。

准备工作

在开始添加自定义字体之前，需要先准备好以下两个文件：

• 字体文件：通常是 .ttf 或 .otf 格式的字体文件。
• 字体 CSS 文件：用来定义字体名称、字体样式和显示效果等。

字体文件

可以从开源字体库或购买商业字体库中下载字体文件。下载完成后，将字体文件保存在主题文件夹中的 fonts 文件夹中。

字体 CSS 文件

字体 CSS 文件用来定义字体样式和显示效果。在 fonts 文件夹中新建一个 fonts.css 文件，添加以下代码：

@font-face {
  font-family: 'YourFontName';
  src: url('fonts/your-font-name.ttf') format('truetype'); /* 字体文件名和路径 */
  font-weight: normal; /* 字体粗细 */
  font-style: normal; /* 字体风格 */
}

将 YourFontName 替换为您的字体名称，将 your-font-name.ttf 替换为您的字体文件名和路径。

添加字体到主题中

准备好字体文件和字体 CSS 文件后，就可以将字体添加到 WordPress 主题中了。

在主题文件夹中打开 functions.php 文件，添加以下代码：

function wp_add_theme_fonts() {
    wp_enqueue_style( 'your-font-name', get_template_directory_uri() . '/fonts/fonts.css', array(), '1.0.0', 'all' );
}
add_action( 'wp_enqueue_scripts', 'wp_add_theme_fonts' );

将 your-font-name 替换为您的字体名称，/fonts/fonts.css 替换为您的字体 CSS 文件的路径。

测试字体效果

添加完字体后，需要测试字体的效果。可以在文章或页面中添加以下测试代码：

<h1 style="font-family: 'YourFontName', sans-serif;">This is a heading with your custom font.</h1>
<p style="font-family: 'YourFontName', sans-serif;">This is a paragraph with your custom font.</p>
<ul style="font-family: 'YourFontName', sans-serif;">
  <li>This is a list item with your custom font.</li>
</ul>

将 YourFontName 替换为您的字体名称。

结论

将自定义字体添加到 WordPress 主题中非常简单，只需要准备好字体文件和字体 CSS 文件，然后在 functions.php 文件中添加代码即可。添加自定义字体可以让您的网站更具个性化，赢得更多用户关注和喜爱。