gutenbergdocs/docs/explanations/architecture/key-concepts.md
2025-10-22 01:40:18 +08:00

69 lines
5.5 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 核心概念
## 区块
区块是用于构建和交互内容的抽象单元。当它们组合在一起时,就构成了网页的内容。从段落、视频到网站标题,所有内容都以区块形式呈现。
区块形式多样但提供统一的交互界面。它们可被插入、移动、重新排序、复制、克隆、转换、删除、拖拽和组合。区块还支持复用功能,可在不同文章和文章类型间共享,或在同一文章中多次使用。简单来说,可将区块视为更优雅的简码,配备丰富的格式工具供用户编排内容。
区块设置与内容主要在三个区域进行自定义:区块画布、区块工具栏和区块检查器。
### 组合性
区块支持多种组合方式。它们具有层级结构,允许区块嵌套于其他区块内。嵌套区块与其容器分别称为*子区块*和*父区块*。例如*多栏*区块可作为父区块在其各栏中包含多个子区块。管理子区块使用的API命名为`InnerBlocks`。
### 数据与属性
区块将内容解析为属性并可序列化为HTML。为此专门设计了新的区块语法规则区块语法本质上是HTML注释可以是自闭合标签或包含起始/结束标签。根据区块类型和用户自定义设置主标签内可能包含JSON对象。这种原始区块形态称为序列化形态。
```html
<!-- wp:paragraph {"key": "value"} -->
<p>欢迎来到区块世界。</p>
<!-- /wp:paragraph -->
```
区块分为静态与动态两类。静态区块包含渲染内容和属性对象,可根据变更重新渲染。动态区块在生成文章内容时需要服务器端数据和渲染过程。
每个区块包含属性或配置设置这些数据可从内容中的原始HTML、元数据或其他自定义来源获取。
详细了解[数据格式与数据流](/docs/explanations/architecture/data-flow.md)。
### 区块转换
区块具备转换为其他区块类型的能力。既可实现基础操作(如将段落转为标题),也能完成复杂转换(如多张图片转为相册)。区块转换适用于单个区块及多选区块组合,内部区块变体也可作为转换目标。
### 区块变体
区块变体是特定区块类型的预定义初始属性集合。该API支持创建基础区块并衍生出多种配置方案。变体提供不同的交互界面既可在库中显示为全新区块也可作为插入新区块时的预设模板。详见[API文档](/docs/reference-guides/block-api/block-registration.md#variations-optional)。
**区块进阶指南**
- **[区块API](/docs/reference-guides/block-api/README.md)**
- **[教程:构建自定义区块](/docs/getting-started/devenv/get-started-with-create-block.md)**
## 可复用区块
可复用区块是区块(或多个区块组合)的**实例**,可在多处插入和编辑,并保持全局同步。当在某处编辑可复用区块时,所有使用该区块的文章和页面都会同步更新。典型应用场景包括:具有特定内容和自定义颜色的标题区块(用于多个页面),以及侧边栏小组件(用于所有页面)。
对可复用区块的任何编辑都会自动同步到所有使用位置,避免在不同文章中重复修改。
技术上,可复用区块以隐藏文章类型(`wp_block`)存储,属于动态区块,通过"引用"方式关联`post_id`并返回对应区块的`post_content`。
## 区块模式
[区块模式](/docs/reference-guides/block-api/block-patterns.md)是由多个区块组合形成的设计范式。这些设计模式为快速构建高级页面和布局提供起点,无需逐个插入区块。区块模式小至单个区块,大至整页内容。与可复用区块不同,模式插入后不会与原始内容保持同步,其包含的区块需用户自行编辑定制。本质上,模式就是常规区块的组合。主题可通过注册模式,为用户提供符合其设计语言的快速入门方案。
## 模板
文章编辑器专注于内容创作,而[模板](/docs/reference-guides/block-api/block-templates.md)编辑器支持用区块声明和编辑整个站点(从页眉到页脚)。模板系统分为完整页面模板和模板部件(描述模板内的可复用区域,包括页眉、侧边栏、页脚等语义区域)。
这些模板和模板部件可由主题组合注册。用户也可通过区块编辑器完全自定义它们。在编辑模板时,与站点属性(如站点标题、描述、徽标、导航等)交互的区块集合尤为实用。自定义模板保存在`wp_template`文章类型中包括静态页面和动态页面如归档页、单篇文章页、首页、404页等
注意:自定义文章类型也可通过初始`post_content`模板初始化,请勿与上述主题模板系统混淆。
深入了解[全站编辑模板](/docs/explanations/architecture/full-site-editing-templates.md)。
## 样式
样式系统(代码中仍沿用旧称“全局样式”)既是用户通过编辑器访问的界面,也是通过[`theme.json`文件](/docs/how-to-guides/themes/global-settings-and-styles.md)实现的配置系统。该文件整合了通常分散在多个`add_theme_support`调用中的配置项简化与编辑器的通信。其目标是改进以下功能的声明方式应启用的设置、主题提供的特定工具如自定义调色板、可用的设计工具以及协调WordPress、活跃主题和用户样式的基础架构。
了解更多关于[全局样式](/docs/explanations/architecture/styles.md#global-styles)的信息。