欢迎来到本课程,我们将探索如何使用Customize API为经典主题添加选项。
学习目标
通过本课程,您将能够:
描述Customize API(即定制器)的功能,
列举主题中使用定制器的示例,
使用定制器注册主题选项。
什么是定制器?
这里我们以Twenty Twenty-Four主题为例。
当前激活的主题是什么?当我们将鼠标悬停在”外观”上时,可以看到可以访问站点编辑器。让我们进入”主题”并安装一个经典主题。
点击”添加新主题”,选择Twenty Twenty-One主题。安装并点击”激活”。
我们会看到几个新菜单。但是,由于经典主题无法访问站点编辑器,我们不再看到”编辑器”选项。
现在用户可以点击”定制”来打开定制器。在这里,用户可以做出全站范围的更改,比如修改颜色,还有一个暗黑模式的选项。
这就是我们接下来要探讨的内容。
使用定制器
现在让我们看看Twenty Twenty-One主题中如何使用定制器。
当用户点击”颜色和暗黑模式”时,他们可以选择点击颜色选择器来更改背景颜色。
让我们看看代码是如何实现这一功能的。
如果我们打开functions.php文件,会看到刚才看到的默认颜色是通过add_theme_support()指定的。这里还有编辑器调色板。这就是用户可以从调色板中选择的方式。
让我们再看一下前端,看看这些功能是如何在定制器中为用户呈现的。
他们点击颜色选择器,然后就能看到调色板。请注意,他们也可以输入十六进制代码,或者滚动选择自己喜欢的颜色。
注册主题选项
让我们看看如何使用定制器注册主题选项。
这一切都始于WP_Customize_Manager类,它将帮助你在定制器中创建这些控件。注意这里的注释,它说明了$wp_customize对象如何作为这个类的实例使用,这是在主题中使用这个类的主要方式。
function themeslug_customize_register( $wp_customize ) {
// 使用$wp_customize(WP_Customize_Manager对象)进行操作
}
add_action( 'customize_register', 'themeslug_customize_register' );
这里我们看到Twenty Twenty-One主题中调用WP_Customize_Manager来创建$wp_customize对象的类。如果我们向下滚动一点,就能看到这个类是如何编写的,以连接我们刚才在functions.php文件中看到的内容。
我们定义了背景颜色,这里有控件注册,使用get_theme_support()调用调色板,最后我们使用数组构建调色板。
然后在这里底部添加背景颜色的控件,覆盖了WordPress默认的背景颜色控件。
更多细节,强烈建议开发者研究核心定制器代码。这些是所有包含”customize”一词的核心文件,你可以在WordPress安装文件夹的’wp-includes/customize’中找到它们。
下一步
你可以参考WordPress.org上的主题手册,阅读更多关于使用Customize API添加主题选项的内容。