Autoplay
Autocomplete
Previous Lesson
Complete and Continue
Block Theme Academy
Welcome to the course
Hello and welcome! (1:09)
How this course is structured (3:38)
How to access the private community (1:51)
An update is in progress for WordPress 6.7 (1:34)
Resource Vault
Local development setup
[*] Introducing the LocalWP development environment (1:01)
[*] Introducing the VS Code editor and PHPStorm IDE (2:13)
[*] Configuring the debugging settings in WP Config (3:20)
[*] Recommended development plugins (1:56)
Understanding Full-Site Editing
Full-Site Editing: The Big Picture (6:50)
What is Full-Site Editing? (4:02)
A developer's view on block themes and the Site Editor (3:07)
[*] What is the Site Editor? (5:35)
[*] How block themes and the Site Editor work together (2 videos) (6:59)
The three theme types: Classic, Hybrid, and Universal (4:44)
How are block themes structured? (2 videos) (5:34)
What is the Global Settings and Styles feature? (2:59)
What is theme.json? (3:22)
What is the JSON format? (3:46)
Section survey
Using the Site Editor
[*] Overview of the main features of the Site Editor (1:54)
[*] How to access and exit the Site Editor (1:38)
[*] Navigate using the interface (2:17)
[*] What is the Focus mode? (2:46)
[6.7] Introducing the Responsive View (2:07)
[6.7] Introducing the Zoom Out mode (2:11)
How to export changes to the theme with the Create Block Theme plugin (3:29)
[*] Site Editor features not compatible with the export feature (2:46)
Understanding Settings
What are Settings, why should I use them? (4:05)
How does the Settings Interface work? (2 videos) (3:16)
What is the Settings Engine, and what does it do? (2:33)
How to control Settings using Theme.json (3:32)
How to handle Settings according to the theme type (3:17)
Introduction to removing customization settings (1:53)
Removing settings from all or specific block types (2:52)
Removing settings based on post type or user role (4:44)
What are Custom Properties? (3:20)
Should I use version 3 of theme.json? (2:30)
[Exercise] Creating the Bosco Blocks theme starter files (3:01)
[Exercise] Enabling all Appearance Tools in Bosco Blocks (2:10)
Section survey
Implementing Layout Settings
What are the Layout Settings? (1:04)
How do the Content and Wide Sizes work? (2 videos) (7:54)
Implementing the global Content and Wide Sizes
Implementing additional Content and Wide Sizes (3:51)
Implementing and understanding Block spacing (5:42)
Implementing and understanding Root Padding (4:37)
[Exercise] Adding Content an Wide Sizes to Bosco Blocks (3:46)
Section survey
Implementing Color Settings
What are the Color Settings? (1:48)
How to remove Color Settings
Adding a Color Palette
Adding a Gradient Palette
[Exercise] Adding a color palette to Bosco Blocks (2:55)
Section survey
Implementing Typography Settings
What are the Typography Settings? (1:25)
How to remove Typography Settings
Adding and managing fonts using the Font Library (2:37)
Technical implementation of the Font Library (2:58)
How to add fonts using theme.json
How to add a Font Size selector (3:45)
Font Size best practices (2:19)
What are Fluid Font Sizes, and why should I use them? (3:33)
How to implement Fluid Font Sizes
What is appearance (font weight and font style)?
Line height
Letter spacing
Text decoration
Letter case
Drop cap
[Exercise] Adding the Lora font family to Bosco Blocks (2:10)
Section survey
Implementing Dimension Settings
What are the Dimension Settings? (1:02)
How to add and remove Dimension Settings
Adding a Spacing Palette (3:56)
[Exercise] Adding a spacing palette to Bosco Blocks (4:10)
Section survey
Understanding Styles
The What and Why of Styles (6:20)
The How of Styles (2:24)
How styles are transformed into CSS (6:07)
Understanding the Style Hierarchy (2:45)
Section survey
Implementing Styles
Creating base styles (1:19)
Creating element styles (2:03)
Creating block type styles (3:26)
Creating styles for elements in specific blocks
Styling hover and other pseudo-classes
Border styles
Color styles
Spacing styles: Margin and padding
Typography styles
Global Styles Variations (8:10)
The What and Why of Section Styles (10:31)
Creating a Section Style (10:39)
[Exercise] Overview of the next exercises (1:03)
[Exercise] Implementing the base styles in Bosco Blocks (2:57)
[Exercise] Implementing the element styles in Bosco Blocks (3:08)
[Exercise] Implementing the block type styles in Bosco Blocks (1:12)
Section survey
Styling with CSS
How the iFramed Content Editor impacts CSS styles (4:04)
enqueue_block_editor_assets hook behavior (6:02)
Custom CSS in the Site Editor (3:23)
Section survey
Creating Template Parts
Template parts in classic themes (1:30)
Template parts in block themes (2:39)
Template parts and template part areas (3:42)
Header and footer in classic vs block themes (4:10)
Creating template parts (1:49)
Possible pitfalls when creating template parts (2:10)
Template part variations (2:55)
[Exercise] Implementing the Header and Footer styles (3:56)
Section survey
Creating Templates & Page Templates
Introduction to template creation workflows (0:36)
Overview of the Template management interface (3:29)
Creating a new Template (2:29)
Exporting a template from the Site Editor (1:45)
Pitfalls of managing custom templates from the Content Editor (2:05)
Creating a custom page template (3:50)
[Exercise] Overview of the next exercises (0:21)
[Exercise] Implementing the Index structure (2:35)
[Exercise] Implementing the Index styles (5:15)
Section survey
A small ask
Could I have 5 minutes of your time? (1:49)
Creating Layouts
What you'll learn in this section (0:57)
Required foundations for layout building (2:13)
Don't make this mistake when building (3:41)
Discovering the Group block (1:18)
Understanding the Flow and Constrained layouts (3:41)
Understanding block width handling in constrained layouts (5:18)
Understanding the Row and Stack layouts (1:57)
Understanding the Grid layout (11:08)
Introduction to Sticky Positioning (1:17)
Using Sticky Positioning for sticky header and sticky content sections (4:08)
Section survey
Creating Block Patterns
Introduction to block patterns (3:42)
Introduction to Atomic Design (7:13)
Overview of the pattern management interface (6:22)
The four pattern types (4:40)
Pattern sources (3:25)
Differences between patterns and template parts (3:09)
Creating a new pattern (1:44)
Differences between unsynced, synced, partially synced patterns (7:46)
Creating partially synced patterns (7:16)
Pattern Autoregistration (4:13)
Quick reference: Pattern registration options
Using Patterns for Internationalization (7:08)
Using Patterns for Static Assets (5:42)
Section survey
Creating Performant Themes
Implementing performant images (5:36)
Migrating image URLs on the fly (4:55)
Integrating Post Meta
Why you need to register post meta (5:28)
How to register post meta (4:36)
[6.7] Displaying and editing post meta using Core blocks (2:45)
[6.7] Limitations of the Block Bindings interface in WordPress 6.7 (4:21)
Using block variations to create pre-bound blocks (3:22)
Answering common questions about bound blocks (2:31)
Section survey
Creating Block Child Themes
About this section
How to unregister parent theme patterns using an allow list
From Discovery to Launch - Project Architecture
About this section
Should I build a classic, hybrid, or block theme? (7:05)
How to choose a starter theme: 3 scenarios (6:30)
From Discovery to Launch - Curating the Editor Experience
Controlling the default WordPress experience (5:15)
Initial Theme Setup checklist
Removing Directories: Block Patterns, Block Plugins, OpenVerse Media (8:39)
Removing unwanted blocks globally (4:10)
Removing unwanted blocks for specific post types or editors (6:07)
Section survey
Useful Plugins
Debugging themes with Query Monitor (5:44)
Teach online with
[Exercise] Adding Content an Wide Sizes to Bosco Blocks
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock