|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/wordpress-gutenberg-full-site-editing-fse/
课程评论:没有评论
WordPress Gutenberg 区块编辑器与全站编辑(Full Site Editing, FSE)实战课程(2025年1月更新) 本课程将带您深入了解 WordPress 5.0 起引入的 Gutenberg 区块编辑器,并重点讲解其核心功能——全站编辑(FSE)。Gutenberg 取代了传统的经典编辑器,提供了一种直观的拖放式区块构建方式,可用于创建文章和页面。 **课程亮点:** * **Gutenberg 编辑器深入解析:** 学习如何利用 Gutenberg 创建更具吸引力的网页内容,涵盖常用区块(段落、图片、视频、按钮、封面、查询循环、列、表格等)以及高级设计区块(组、行、堆叠、网格)。 * **全站编辑(FSE)全面掌握:** 学习如何使用相同的区块编辑器来设计和编辑网站的页眉、页脚和主体内容,从而实现对网站设计的完全控制。 * **实践案例:** 以 WordPress 最新区块主题 Twenty Twenty-Five 为例进行教学。 * **高效工作流程:** 掌握文档概览(Document Overview)和命令面板(Command Palette)以提升效率。 * **设计细节:** 理解并运用宽幅(wide)和全幅(full-width)选项,掌握内边距(padding)和外边距(margin)的使用。 * **全局样式:** 学习如何运用全局样式,包括字体(支持所有 Google 字体)、配色方案、背景、阴影、布局和间距,并自定义区块的默认外观。 * **区块主题从零构建:** 学习如何从头开始创建一个完整的区块主题,包括理解并创建模板(Templates)和模板部件(Template Parts)。 * **高级查询循环:** 探索更高级的“手动”查询循环用法,实现页面上多个查询循环的设计。 * **WordPress 主题演进:** 回顾从 Twenty Twenty-Two 到 Twenty Twenty-Four 再到 Twenty Twenty-Five 的主题演进。 * **附加实用技巧:** 学习创建登陆页面、添加自定义 CSS、以及在主题或局部区域添加侧边栏。 **学习目标:** 课程结束后,您将能够自信地使用 Gutenberg 编辑器独立设计您的网站,包括页眉、页脚和文章内容,并熟练掌握 WordPress 的全站编辑功能。
Fully Updated in January 2025.Gutenberg was launched as an integrated part of WordPress 5.0. Gutenberg was the name given to the new block editor that replaced the Classic WYSIWYG editor that we'd been using since the early versions of WordPress. Gutenberg is the editor of choice as you create the content for your WordPress posts and pages. There's blocks for headings, blocks for images, blocks for text. And blocks for just about anything else you'd want to add to a web page. You can build your posts and pages by dragging the blocks onto, and around, the editor. But Gutenberg had a huge update with version WordPress 5.9. Full Site Editing! This is often abbreviated to FSE and quite often just Site Editing, but what does this mean?Using the same block editor (Gutenberg) you've been using for your content, you can now edit and design the headers and footers for your website. So you design the bit at the top of the page, the bit at the bottom, and the bit in the middle. That means you now have total control over the design of your website. That is Full Site Editing. You can also create a complete block theme from scratch, and I'll show you how.This course is designed to get you up to speed quickly with Full Site Editing in WordPress. In this course:We take a deep dive into using the Gutenberg editor to create better-looking web pages as well as a complete study on the Full Site Editor itself.The course showcases the Twenty Twenty-Five theme, which is the latest block theme from WordPress.You'll learn how to use the Document Overview and Command Palette to enhance your workflow.You'll learn about the normal, wide, and full-width options you can use in your design, and how to set these values yourself.You'll look at the box model so you fully understand padding and margin, and when to use each of these to add space around your design elements.We'll cover the most common blocks, like paragraph, image, video, button, cover, query loop, columns, table, etc., but also advanced design blocks like Groups, Rows, Stacks, and Grids.You'll explore template hierarchy and how themes consist of templates and template parts.You'll learn to use Global Styles, including typography (where you'll be able to install and use any Google font you want), color palettes, backgrounds, shadows, layout and spacing, and even how to change the default appearance of any block.Following the detailed study of Gutenberg, we'll create a fully functional block theme from scratch, building the template parts and templates required to run a full site. During this process, you'll understand which template you need to create for any post type on your site. We'll even look at using the query loop in a more advanced "manual" way, so you can include multiple query loops on a page for more design flexibility.At the end of the course, we'll study all of the other block themes WordPress created, from the Twenty Twenty-Two theme to the Twenty Twenty-Four theme, and how each built on the previous theme, culminating in the latest Twenty Twenty-Five theme that we used and studied during the course.A final section of the course looks at a few "extras" that were requested from students of previous versions of the course, like creating a landing page, adding custom CSS to a block theme, and even how to add a sidebar to your theme or just to specific areas of your website.By the end of the course, you'll have the confidence to take over the design of your own website, using Gutenberg to design the header, footer, and content. You'll be on your way to mastering Full Site Editing.