欢迎来到这节关于模板用途、结构和加载方式的课程。
通过本课程,您将能够:
- 描述模板的用途和结构
- 列出WordPress加载模板的顺序
- 在准备好主题启动文件的情况下,从零开始创建模板
模板的用途和结构是什么?
创建模板是为了给页面提供结构。它们决定了布局,并能引入不同的部分,如页眉、主体和页脚。如果检查这段代码,可以看到浏览器如何通过引入页眉、主体和页脚的代码在前端渲染页面。
这里我们看到的是默认主题Twenty Twenty-Four中的404模板。
可以看到,对于这个区块主题,使用区块标记来引入页眉、主体和页脚。还可以看到使用了模式(patterns)来从模式文件夹中的文件引入代码。
请注意,在区块主题中不能直接使用HTML。那段”Hello World”代码会导致错误,当我进入站点编辑器查看404模板时就能看到这个错误。
删除了”Hello World”代码后,我想指出的另一点是:在站点编辑器中进入代码编辑器时,模式的代码实际上是被引入到这里。注意到这里完全没有提到模式吗?在构建模板时请记住这一点。
WordPress加载模板的顺序是什么?
模板有一个加载顺序,最底层是主题模板。其次,如果有活动的子主题,子主题模板优先。最后在顶层,保存在数据库中的用户自定义设置具有最高优先级。
在准备好主题启动文件的情况下,让我们从零开始创建一个模板。如果您不熟悉主题启动文件,建议您查看WordPress初学者开发者的主题开发模块。
从零开始创建模板
让我们构建自己的404模板,但首先看看Twenty Twenty-Four主题中是如何创建404模板的。
在主体部分,我们看到这里调用了一个名为”hidden 404″的模式。让我们进入patterns文件夹,找到hidden-404文件,注意它是PHP文件而非HTML。查看该文件时,发现它又调用了另一个名为”hidden search”的模式,这就是模式中嵌套模式。
我们将利用Twenty Twenty-Four的404模板来节省时间,在已有主题启动文件的情况下,在自己的主题中创建404模板。我已经创建了PHP文件,确保将slug替换为启动文件夹的名称(也就是主题的根目录)。
将所有”twentytwentyfour”替换为您的根目录名称。我的是”gettingstarted”。
准备好这两个模式后,就可以创建404模板了。这是Twenty Twenty-Four的模板,这是我创建的版本。在后续课程中,我将向这个模板添加页眉和页脚。
后续步骤
如果想了解更多关于模板的内容,可以参考WordPress.org上的主题手册。
在接下来的几节课中,我们将讲解模板层次结构和模板部件。