如主题结构一文所述,WordPress要求所有主题都必须包含一个style.css文件。该文件最重要的功能是通过文件顶部的配置数据来向WordPress“注册”主题。许多主题还会利用它向前端(甚至编辑器)提供CSS样式。

在本文档中,您将学习如何通过style.css文件的头部来配置主题数据。

文件头部

style.css文件的头部用于配置与主题相关的数据。WordPress会利用这些信息来确定某些功能的运作方式,并在外观 > 主题页面上向用户展示部分此类数据。

以下是默认主题Twenty Twenty-Three的主题详情覆盖层的外观示例:

显示有Twenty Twenty-Three模态覆盖层的WordPress主题页面,上面展示了主题截图、描述及元数据。

这些信息大多直接来自style.css文件的头部。它是创建WordPress主题时最为关键的部分之一。

在确定哪些主题可供激活时,WordPress会遍历/wp-content/themes下的每个文件夹,寻找style.css文件。一旦找到该文件,它就会提取文件中的前8kb数据,查看其中是否包含定义了标准字段的文件头部。

在主题中,这通常只是一个包含了一些标准键值对的CSS注释块。

假设您要创建一个名为fabled-sunset的主题,WordPress会在以下位置查找您的主题的style.css文件:

  • wp-content/
    • themes/
      • fabled-sunset/
        • style.css

若要让WordPress识别您的主题,您至少需要在style.css的顶部定义主题名称字段,示例如下:

/**
 * Theme Name: Fabled Sunset
 */

这是有效主题所必需的最少头部字段。当然,您还会希望为主题添加更多信息。

头部字段

目前有众多受支持的字段,而在创建主题时您很可能会用到其中的大部分。以下是一个已配置了所有字段的主题style.css文件头部的示例:

/**
 * Theme Name:        Fabled Sunset
 * Theme URI:         https://example.com/fabled-sunset
 * Description:       Custom theme description...
 * Version:           1.0.0
 * Author:            Your Name
 * Author URI:        https://example.com
 * Tags:              block-patterns, full-site-editing
 * Text Domain:       fabled-sunset
 * Domain Path:       /assets/lang
 * Tested up to:      6.4
 * Requires at least: 6.2
 * Requires PHP:      7.4
 * License:           GNU General Public License v2.0 or later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 */

下表列出了这些字段各自的用途。

虽然主题名称是用于与WordPress配合使用的唯一必填字段,但当向WordPress主题目录提交主题时,还必须包含其他一些字段。这些字段在下方用*标出。

  • Theme Name*:您主题的唯一名称。
  • Theme URI:用户可以在此处找到关于该主题更多信息的公共网页的URL。
  • Description*:主题的描述内容,会在WordPress管理界面及其他地方查看主题详情时显示出来。提交到WordPress主题目录的主题也需要填写此字段。
  • Version*:主题的版本号,采用X.X或X.X.X格式表示。
  • Author*:开发该主题的您的姓名或所属组织的名称。对于提交到主题目录的主题,建议使用WordPress.org上的用户名。
  • Author URI:创建该主题的个人或组织的URL。
  • Tags:主题所支持的功能的逗号分隔列表。《主题评审手册》中提供了可用于提交到主题目录的有效标签列表,不过第三方网站可能会采用不同的标签系统。
  • Text Domain*:用于翻译的文本域字符串。
  • Domain Path:主题翻译文件的相对路径。当主题被禁用时,WordPress会使用此字段来检测是否存在翻译文件。默认值为/languages。
  • Tested up to*:该主题已测试过的最后一个WordPress版本,采用X.X格式表示(例如6.4、6.2.1等)。
  • Requires at least*:该主题可以正常运行的最旧WordPress版本,采用X.X格式表示(例如6.3、6.2.1等)。
  • Requires PHP*:该主题可以正常运行的最旧PHP版本,采用X.X格式表示(例如8.0、7.4等)。
  • License*:该主题所使用的许可证类型。
  • License URI*:该主题许可证的URL。

子主题的头部字段

在创建子主题时,还有一个额外的受支持字段:模板。该字段用于指定父主题的文件夹路径。

如果上面提到的虚构主题“Fabled Sunset”是您名为“Grand Sunrise”的子主题的父主题,那么您的style.css头部字段将会类似如下所示:

/**
 * Theme Name: Grand Sunrise
 * Template:   fabled-sunset
 * ...其他头部字段
 */

为了使此设置生效,模板字段必须与父主题的文件夹名称完全一致(相对于wp-content/themes目录而言)。否则,WordPress将无法正确匹配它们。

您可以在“高级主题”章节中了解更多关于子主题的信息。

自定义头部字段

某些第三方市场平台或系统也可能使用自定义头部字段。虽然WordPress并未正式支持这些字段,但它们是被允许使用的,且不应对主题在WordPress中的运行方式产生负面影响。

自定义CSS

style.css文件并不仅仅是一个配置文件。只要该文件能够被正确加载,您还可以利用它来编写自定义CSS代码,从而修改主题的设计。

对于块主题而言,理想情况下大部分甚至所有的设计工作都是通过theme.json文件来处理的,相关内容您可以在全局设置与样式文档中了解。

但有时您可能会希望或需要添加自定义CSS代码。相关内容可在引入资源文档中查看。