首页 / 主题开发手册 / 区块主题

区块主题

区块主题是一种使用块状结构的WordPress主题。你可以在网站编辑器中编辑一个区块主题的所有部分。

WordPress从5.9版本开始支持区块主题,在5.8版本中通过Gutenberg插件提供有限的支持。与样式界面一起,区块主题是全站编辑的一部分。它们有时被称为全站编辑主题。了解全站编辑的背景

你可能还有兴趣阅读关于区块主题的支持文章

在手册的这一部分,你将了解到:

  • 经典主题和区块主题之间的区别
  • 区块主题设置
  • 模板和模板片段
  • theme.json 配置文件
  • 将经典主题转换为区块主题

本章的先决条件:主题基础知识

区块主题的好处

为什么要创建区块主题?虽然WordPress继续支持经典主题,但区块主题的建立是为了提高可扩展性和性能。

  • 区块主题通过只为页面上已呈现的区块加载样式来提高加载性能
  • 区块主题不需要为前端和编辑人员手动引入样式表
  • Theme.json处理add_theme_support()的所有方面
  • 无障碍功能,如跳到内容、键盘导航和地标等,都是自动生成的,无需添加额外代码
  • 通过一个区块主题,用户可以在没有代码的情况下编辑他们网站的所有部分
  • 通过使用样式界面,用户可以为网站和区块定制颜色和排版

 

经典主题和区块主题的异同点

许多概念和功能对于经典主题和区块主题都是相同的,在某些情况下,手册会提到关于经典主题的章节。

对于习惯于创建经典主题的主题开发者,有一个比较表:

经典主题: 区块主题:
使用PHP文件来显示内容和各部分 使用HTML文件来显示区块。
如果WordPress找不到HTML文件,则使用PHP文件作为后备方案。
single.html相当于使用single.php
使用模板层次结构 使用模板层次结构
使用PHP函数如模板标签来显示内容 全部使用区块
文章内容区块相当于使用the_content().
使用PHP函数使文本可翻译 HTML文件中的文本是不能翻译的。
区块模式可以使用PHP函数来使文本可翻译。
使用PHP函数进行if/else 条件判断 使用区块设置来实现不同的结果
使用循环来显示不同的文章和文章类型 使用查询块和文章模板块
可以使用侧边栏小工具 使用区块而不是小工具。WordPress中的小工具已经被转换为区块。
可以使用定制器 使用网站编辑器,可以选择性地启用定制器菜单
必须注册导航菜单来自定义菜单 使用导航区块
可以注册自定义页眉 使用区块来完全定制网站的页眉,包括图片
可以注册自定义logo 使用网站logo区块
可以引入CSS和javascript 可以引入CSS和javascript,但更多地依赖于区块和theme.json配置文件
可以使用theme.json,但主题作者需要为前台引入样式 可以使用theme.json,并且样式会自动引入到编辑器和前台
可以将模板文件放在根目录中 将模板文件放在templates文件夹
可以将模板片段放在任意目录 将模板片段放在parts文件夹
不能在网站编辑器中创建和编辑404和存档页等网站模板 可以在网站编辑器中创建和编辑如404和存档页等网站模板
可以在主题有支持的模板编辑器中创建和编辑区块模板 可以在模板编辑器中创建和编辑区块模板