《WordPress 设计入门》视频教程完整版｜文派中英字幕

设计师学 WordPress，这套教程就是你的最佳起点。

专为视觉创作者打造的 WordPress 设计入门教程。无需编写代码，也不用接触 PHP¹，借助 WordPress 现代化的 Site Editor² 和 block theme³，就能做出专业级的网站设计。

设计师为什么要学 WordPress？

传统设计工具产出的是”静态图”，而 WordPress 做出的是”可用的网站”。客户需要的，恰恰是后者。

站点编辑器让设计师真正实现”所见即所得”的网站设计，调整布局、更换字体、设置颜色、定制页眉页脚，全部在可视化界面中完成。掌握这套工具，你能承接更多建站项目，报价也能更上一层楼。

这套教程能学到什么？

站点编辑器全攻略：从界面认识到高阶操作，彻底掌握 WordPress 最核心的设计工具。

区块主题设计：理解全局样式、模板部件、区块模式的设计逻辑，学会自由定制任意主题。

视觉设计实战：涵盖页面布局、排版设计、响应式适配、动效控制，设计师关心的核心技能一网打尽。

插件辅助设计：轮播滑块、动态效果、表单美化等能力也覆盖在课程里。

课时列表

全套 24 节课，已全部上传哔哩哔哩。

序号	中文课时	英文原名	观看
1	面向设计师的 WordPress 展示	WordPress showcase for designers	观看
2	用样式手册指导设计	Using the Style Book4 as a design guide	观看
3	理解区块主题术语与层级	Overview of WordPress block theme3 terms and hierarchy	观看
4	用区块优先思维做设计	Designing with a block first mindset	观看
5	找到适合设计需求的区块主题	Finding a block theme for your design needs	观看
6	选择与安装插件	Choosing and installing a plugin	观看
7	认识 WordPress 仪表盘	Getting started with the WordPress Dashboard5	观看
8	搞懂文章与页面的区别	Understanding the difference between WordPress posts and pages	观看
9	为什么用站点编辑器做设计原型	Why design in the Site Editor2 and use it for prototyping？	观看
10	创建包容性网站的无障碍指南	Web accessibility6 guidelines to create inclusive websites	观看
11	测试内容的无障碍性	Testing your content for accessibility	观看
12	初识站点编辑器	Intro to the Site Editor	观看
13	区分首页显示设置与不同模板	Differentiating between homepage display settings and various templates	观看
14	使用页面模板	Using page templates	观看
15	使用模板部件	Using template parts	观看
16	自定义颜色、字体、排版与布局	Customizing theme settings： Colors, fonts, typography and layout	观看
17	使用 Group 区块做设计	Designing with the Group block7	观看
18	使用 Row 与 Stack 区块做设计	Designing with Row8 and Stack9 blocks	观看
19	使用 Columns 区块做设计	Designing with the Columns block10	观看
20	尺寸设置：内边距、外边距与区块间距	Dimensions： Padding, margin and block spacing	观看
21	使用图库区块	Utilize the Gallery block11	观看
22	使用媒体与文本区块	Using the WordPress Media and Text block12	观看
23	深入了解封面区块	Uncovering the Cover block13	观看
24	用插件创建轮播滑块	Using a plugin to create a carousel slider14	观看

本教程由文派开源团队制作发布，遵循知识共享协议。在 B 站关注「文派开源」获取更多 WordPress 学习资源。

名词解释

1. PHP：WordPress 主要使用的服务器端脚本语言。 ↩︎
2. Site Editor：WordPress 的全站可视化编辑工具，可编辑模板、样式与站点结构。 ↩︎
3. block theme：基于区块系统构建的主题，可直接在编辑器中定制模板和样式。 ↩︎
4. Style Book：集中预览主题区块样式的设计参考界面。 ↩︎
5. WordPress Dashboard：WordPress 后台管理主界面，用于管理内容、外观、插件和设置。 ↩︎
6. accessibility：让更多用户，包括残障用户，也能顺畅使用网站的设计与开发实践。 ↩︎
7. Group block：用于组织多个区块并统一设置布局、间距和样式的容器区块。 ↩︎
8. Row：让多个区块按水平方向排列的布局方式。 ↩︎
9. Stack：让多个区块按垂直方向堆叠排列的布局方式。 ↩︎
10. Columns block：用于创建多列版式布局的区块。 ↩︎
11. Gallery block：用于批量展示多张图片并管理网格排版的区块。 ↩︎
12. Media and Text block：把媒体内容与文字说明组合展示的区块。 ↩︎
13. Cover block：可在图片或视频上叠加文字与内容的视觉区块。 ↩︎
14. carousel slider：以轮播方式切换多张图片或内容卡片的界面组件。 ↩︎