# 面向开发者的 WordPress 区块主题，基于 theme.json 构建 URL: https://canvaswp.com/zh-hans/solutions/developers/ Updated: 2026-11-03 面向开发者的 Canvas Canvas 是一款 WordPress 主题，外加一个配套插件，而且从头到尾都是区块主题。模板是区块模板，样式来自 theme.json，编辑器保存到数据库中的内容，与其他任何区块主题读取的区块标记完全相同。这里的一切都不依赖页面构建器。 [查看全部功能](https://canvaswp.com/zh-hans/features/) [阅读文档](https://docs.canvaswp.com/) 更新于 2026年11月3日 架构 ## 区块主题，在 WordPress 原生的编辑位置中修改 主题提供模板、模板部件和样式变体；插件则提供区块库、构建器、表单、SEO 与性能相关功能以及演示导入器。模板和全局样式都保留在站点编辑器中，因此网站的任何内容都不会藏在我们的设置面板里。 - 173 个区块模板和 5 个模板部件，均可在站点编辑器中编辑 - 4 种样式变体，包括深色和午夜色，可在站点编辑器中切换 - 颜色与排版通过 theme.json 统一应用，因此编辑器中显示的字体与前端一致 - 183 个区块模式，以一次性副本的形式插入标记代码 - 打开页面时，整个模板会围绕您正在编辑的内容完整呈现。 [在编辑器与站点编辑器中](https://canvaswp.com/zh-hans/editor/) 模板、模板部件和全局样式仍保留在站点编辑器中，也就是 WordPress 原本的存放位置。 内容 ## 最终存入数据库的是区块标记 选择区块主题的理由并不在于功能列表，而在于五年之后你手里留下的是什么。 ### 没有专有格式 Canvas 编辑标准的 WordPress 区块，没有自有格式，因此即使主题日后更换，文章和页面的内容也能保留。无需记忆短代码，也无需打开代码视图。 ### 设置而非代码片段 访客看到的所有内容都可以通过区块设置面板进行调整。当演示站点需要某项区块无法直接表达的功能时，该区块会新增相应设置，而页面从不会直接加入原始 HTML。 ### 每个区块上的高级面板 编辑器中的每个区块（包括核心区块和第三方区块）都可添加动画、显示条件、自定义类、自定义属性以及区块级自定义 CSS。 ### 资源跟随页面 页面只会加载其所含区块的 CSS 和 JavaScript，因此定价页面永远不会加载滑块脚本。另外有 35 项优化只是开关，无需安装任何插件。 从其他主题迁移过来？Elementor 和 Divi 使用各自的编辑器构建页面，因此构建器一旦移除，布局也会随之消失：请参阅 [Elementor 站点迁移后保留哪些内容](https://canvaswp.com/zh-hans/compare/elementor/)，以及 [Divi Builder 的对比情况](https://canvaswp.com/zh-hans/compare/divi/)。Kadence 和 GeneratePress 同样基于区块编辑器构建，其区块包含在免费插件中（[Canvas 与 Kadence 对比](https://canvaswp.com/zh-hans/compare/kadence/)、[Canvas 与 GeneratePress 对比](https://canvaswp.com/zh-hans/compare/generatepress/)），而 [Blocksy 将其页眉构建器保留在定制器中](https://canvaswp.com/zh-hans/compare/blocksy/)。 [区块主题与页面构建器对比](https://canvaswp.com/zh-hans/guides/block-theme-vs-page-builder/) 站点框架 ## 页眉和页脚构建器以模板部件的形式呈现 页眉、页脚、顶部栏、超级菜单、侧边面板和页面标题都是由区块构建的记录，它们通过主题自身的模板部件呈现在前端。页眉部件会渲染页面所分配的页眉，页脚部件会渲染所分配的页脚记录。这样站点编辑器便能识别它们，并使区块设置与其他位置保持一致。 - 页眉构建器背后有 22 个页眉区块和 94 个页眉选项 - 可全局指定页眉，也可在单个页面上单独覆盖，页脚、顶栏、超级菜单、侧边面板和页面标题同样支持。 - Hero 和滑块同样属于记录，由模板中的插槽区块放置。 - 两个插槽区块都会在编辑画布中渲染，因此页面打开时即可呈现访客实际看到的版块 [页眉构建器的工作原理](https://canvaswp.com/zh-hans/header-builder/) 页眉是由区块组成的记录，通过 Header 模板部件渲染。 WooCommerce ## 24 个商店区块与 18 个商店模板 WooCommerce 为可选项，安装后由区块和模板提供支持，无需维护需要同步的模板覆盖文件。 24 ### 商店区块 用于商品页、商店网格、购物车和结账页面的区块，另有颜色色板，并支持无需刷新页面即可加入购物车。 18 ### 商店模板 用于商店、产品、购物车、结账和账户页面的模板，可与其他模板一样在站点编辑器中编辑。 21 ### 演示商店 在 88 个演示站点中，有 21 个可完整导入为商店，商品、分类、属性和结账流程均已就绪。 21 个商店演示站点中的两个，基于商店区块和模板运行。 [WooCommerce 区块](https://canvaswp.com/zh-hans/woocommerce/) 扩展功能 ## 如您需要，设置向导可生成子主题 只有在计划直接编辑 Canvas 模板文件时才需要创建子主题，因为这样可以确保这些编辑在更新时保持安全。设置向导会在演示导入之前的独立步骤中提供此选项，将其写入您的主题文件夹并启用，之后您的站点外观保持不变。大多数站点并不需要它，因为常见的原因现在都可以通过设置来解决。 - 全站自定义 CSS，以及用于头部和页脚的自定义 JavaScript，位于主题选项的 Misc 部分 - 区块级自定义 CSS，以属性与值的组合书写，不含选择器 - 按区块设置的自定义属性，每行一项，以键和值的形式填写，支持 data 和 aria 属性 - 为您指定的任意选择器设置自定义排版规则，位于“排版”部分。 - 通过内置的 4 个图标包所使用的同一界面，注册您自己的图标包 - 将整套主题选项配置导出为文件，并导入到下一个站点 [主题选项的每个部分](https://canvaswp.com/zh-hans/theme-options/) 高级面板适用于每个区块，包括核心区块和其他插件提供的区块。 运行环境 ## Canvas 需要什么，以及它在接入过程中会做哪些事 这些最低要求是实打实的，并非建议。Canvas 会自行对照您的主机进行检查，因此您不会在导入失败后才得知问题。 WordPress 7.1 或更高版本 PHP 7.4 或更高版本 已测试兼容至 WordPress 7.1 WordPress 自带的区块编辑器和站点编辑器 WooCommerce 可选 - Canvas Core 无需单独下载：许可证激活后，它会直接从 WordPress 内部安装，因此无需管理版本配对 - 更新通过 WordPress 更新屏幕提供，并包含维护模式、临时备份，以及可直接在 WordPress 中回滚。 - 自动更新仅涵盖补丁版本，默认开启且可通过开关关闭；若某个版本修改了您自定义过的模板，发布说明中会注明该模板 - “健康检查”界面会根据您的实际主机检测服务器要求，并报告需要关注的事项，相同的检查项也会显示在 WordPress 站点健康中 - 所有字符串均可翻译，主题和插件的翻译模板会随每次发布重新生成，插件中还包含 WPML 配置文件 - 技术 SEO、XML 站点地图以及 16 种结构化数据类型均在渲染时从您的内容中自动生成 [388 篇文档文章，根据已发布的代码生成](https://docs.canvaswp.com/) 常见问题 ## 技术问题解答 开发者在正式启动项目前会检查的五件事，其中也包括 Canvas 不做的那一件。 **Canvas 是区块主题还是页面构建器主题？** Canvas 是一款完全由区块构建的 WordPress 主题，WordPress 将其称为区块主题。模板为 WordPress 区块模板，模板部件则为 WordPress 模板部件。颜色和排版通过 theme.json 统一管理，所有内容都在 WordPress 随附的区块编辑器和站点编辑器中编辑。无需安装独立的页面构建器，无需学习第二套编辑器，也无需续订页面构建器订阅。 **如果以后更换主题，标记代码会怎样？** 它保持标准的 WordPress 区块标记，因为这正是 Canvas 保存的内容。其他主题无法识别的 Canvas 区块会停止渲染其设计，但标题、段落、图片和列表都是核心区块，在任何地方都能正常读取。内容不会以简码或专有布局格式存储。 **页眉和页脚究竟在哪里渲染？** 这些功能通过 Canvas 注册的模板部件实现，共有 5 个：页眉、页脚、页面标题、侧边栏和备用侧边栏。页眉部件会渲染页面所分配的页眉记录，页脚部件会渲染所分配的页脚记录，页面标题部件会渲染页面标题设置所解析出的内容。这些部件只是底层机制，真正的设计来自您用 22 个页眉区块构建的记录。 **我需要子主题吗？** 仅当您打算直接编辑 Canvas 模板文件时才需要。子主题正是用来保护这些文件不被更新覆盖的。设置向导会在可选的“子主题”步骤中为您创建一个子主题，并将站点切换到该子主题；您也可以自行将 Canvas 内附的子主题文件夹复制到主题目录中。大多数站点都用不到它：主题选项负责全站设置，每个区块的自定义 CSS 和自定义属性负责区块级别的调整，全站的自定义 CSS 与 JavaScript 字段则位于主题选项的“杂项”部分中。 **Canvas 是否为从右到左书写方向的主题？** 是的，每个 Canvas 样式表都有对应的从右到左镜像版本，当网站以阿拉伯语、希伯来语、波斯语或其他从右到左的语言运行时，WordPress 会自动加载它。在全部 88 个演示站点中，有 88 个在发布前经过了从右到左检查，因此菜单、网格和表单都位于正确的一侧。翻译同样完整：两部分产品都附带翻译模板，插件中也包含 WPML 配置文件。 ## 继续探索 ### [定价](https://canvaswp.com/zh-hans/pricing/) 两款套餐均包含全部区块和全部演示站点，并说明何为一个站点，以及到期会带来哪些变化。 ### [许可证条款](https://canvaswp.com/zh-hans/license/) 代码采用 GPL v2 或更高版本授权；许可证密钥管理其周边服务。站点、预发布环境、客户站点与到期规则，逐条说明。 ### [所有行业](https://canvaswp.com/zh-hans/wordpress-themes/) 全部 88 个演示站点，按每个站点所面向的业务类型分组。