Designing with Gutenberg
summary
Demonstrates Gutenberg features that replace classic editing: post cover with image or video, columns that stack responsively on mobile and align without HTML, and reusable blocks export/import as JSON so templates move between sites. Shows Block Manager to disable confusing blocks, adds custom CSS via block classes, and embeds social media URLs natively. Claims Gutenberg is in core, has ~10,000+ commits and ~1,000+ releases, and notes Classic Editor support ends in 2021. The demos work live in the editor and preview.
AI-written summary · about
chapters (19)
- 0:00Introduction
- 1:30Pages
- 2:15Traditional Editor
- 3:30Gutenberg
- 4:00Post Covers
- 5:15Columns
- 7:20Embedding
- 8:00Classic editor
- 8:40Reusable blocks
- 9:25Sharing blocks
- 10:10Block Manager
- 11:15Custom CSS
- 12:55Extra tips
- 14:05Why you should use Gutenberg
- 15:55Gutenberg development
- 16:55Roadmap for Gutenberg
- 18:30Gutenberg demo
- 19:10Questions
- 20:55Copy everything
related talks
35mHow Content Editors Use the Layout Builder: What the User Research Shows
56mUsing WordPress as a Modern Web Dev
42mHeadless CMS
41mHow to design an award-winning website
44mDeveloping a good editor experience with Microsoft 365 / Google Workspace
07mBy the Power of Headless!
46mAmbitious Editorial Experiences with Headless Drupal
37mRemix your UI & UX to another level