阶段 1：基础入门
目标：了解 Gutenberg 编辑器的基本功能和工作原理。
学习内容：
- 什么是 Gutenberg 编辑器？它与经典编辑器的区别。
- Gutenberg 的界面布局和基本概念（例如：区块、工具栏、设置面板）。
- 如何创建和编辑文章及页面。
学习资源：
练习：
- 在本地搭建一个 WordPress 测试站点（可以使用工具如 Local by Flywheel）。
- 使用 Gutenberg 创建一篇简单的博客文章，尝试添加标题、段落和图片。
阶段 2：中级应用
目标：掌握区块的灵活使用，并学习管理页面布局。
学习内容：
- 深入了解常用区块（如图片、视频、表格、按钮）的功能。
- 使用区块组和嵌套区块创建复杂布局。
- 学习如何保存和重复使用区块（可重用区块）。
学习资源：
练习：
- 设计一个包含多个内容模块（如图片、按钮、列表）的着陆页。
- 尝试创建并保存可重用区块，比如一个包含标题和按钮的号召性区块。
阶段 3：高级功能与优化
目标：探索 Gutenberg 的高级功能，包括完整站点编辑（Full Site Editing, FSE）和性能优化。
学习内容：
- 使用完整站点编辑功能自定义主题模板（如页眉、页脚）。
- Gutenberg 与主题的配合使用（如 Astra 或 GeneratePress）。
- 优化内容以提升页面加载速度和 SEO 表现。
学习资源：
练习：
- 使用完整站点编辑功能创建自定义的页眉和页脚设计。
- 优化测试站点的 Gutenberg 页面，使用插件如 WP Super Cache 测试加载速度。
阶段 4：开发者进阶
目标：学习如何扩展 Gutenberg 功能，创建自定义区块和插件。
学习内容：
- Gutenberg 的技术架构和区块开发基础。
- 使用 React 和 JavaScript 创建自定义区块。
- Gutenberg 插件开发的基本流程。
学习资源：
练习：
- 自定义一个简单的 Gutenberg 区块（例如一个带样式的警告框）。
- 开发一个小型插件，集成自定义区块到您的站点。
阶段 5：实践与项目
目标：通过真实项目巩固所学内容，建立个人作品集。
项目内容：
- 使用 Gutenberg 构建一个完整的多页面网站（如博客、作品集或电商网站）。
- 集成自定义区块、模板和优化功能。
展示与优化：
- 将项目部署到网络（可以使用 WordPress 托管服务）。
- 收集用户反馈并进一步优化。
参考资料列表
- Astra. (2025). WordPress Gutenberg Guide for Beginners. Retrieved from https://wpastra.com/guides-and-tutorials/wordpress-gutenberg-guide/
- WPDisc. (2025). How to Use Gutenberg Editor in WordPress. Retrieved from https://www.wpdisc.com/gutenberg/how-to-use-gutenberg-editor-in-wordpress/
- WPDisc. (2025). Gutenberg Full Site Editing: In-Depth Tutorial. Retrieved from https://www.wpdisc.com/gutenberg/wordpress-gutenberg-full-site-editing/
- YouTube. (2025). WordPress Gutenberg Tutorial: Beginner to Advanced. Retrieved from https://www.youtube.com/watch?v=GzoGvr8R4VU
通过上述系统化的学习计划，您可以从零基础逐步掌握 Gutenberg 编辑器的所有功能，并完成实际项目。祝您学习愉快！ 🎉
