carriedils.com
WordPress Developer
WP Engine
Product Marketing
Carrie Dils Rob Stinson
The Fast Track to Mastering Modern
WordPress
3
Agenda.
1. Introduction to Full Site Editing
2. Blocks are the future of WordPress
3. Full site editing themes
4. Timeline for FSE
5. Building custom blocks (live coding demo)
“
“Gutenberg” is a codename for a whole
new paradigm in WordPress site building
and publishing, that aims to revolutionize
the entire publishing experience as much
as Gutenberg did the printed word.
6
The project has four phases:
1. Easier Editing
2. Customization
3. Collaboration
4. Multilingual
Gutenberg
7
The project has four phases:
1. Easier Editing
2. Customization
3. Collaboration
4. Multilingual
Gutenberg
8
The project has four phases:
1. Easier Editing
2. Customization
3. Collaboration
4. Multilingual
Gutenberg
9
Core Editor Blocks
Common Blocks Formatting Blocks
Layout Elements
Widgets
Embeds
10
Full Site Editing Blocks
Header Blocks Post Blocks Comment Blocks
Query Blocks
Structural Blocks
Navigation
11
• Wide image alignment
• Editor color palette
• Editor text size palette
• Responsive embeds
• Frontend & editor styles
• etc...
“Gutenberg Optimized” themes
12
13
WORDPRESS 5.7
Now in Beta 1
FSE is still experimental
• Includes Gutenberg Versions 9.3 - 9.9
• Breaking change to experimental-theme.json structure
• Need to use Gutenberg plugin for experimental features
including Navigation and Widgets
• Includes API endpoints for core block pattern directory
COMING MARCH 2021
WORDPRESS 5.8
FSE “MVP” is in core
• Will include Gutenberg versions 9.10 - ??
• “The MVP should make it possible to build a version of the
Twenty Twenty-One theme, using only blocks, without any
coding knowledge.” - Josepha Haden Chomphosy
• The “six milestones”
COMING JUNE 2021
Timeline for FSE
Custom Block Building
With Genesis Custom Blocks
● A WordPress plugin that provides an admin
interface and a simple templating system for
building custom Gutenberg blocks.
● Blocks that Look & Function EXACTLY as you
need.
● NOT dependant on the Genesis Framework.
16
17
1
2
3
Enough talk. Let’s build some stuff!
1. Simple notification block
2. Hero block
3. Loyal (Woo) Customer block
4. WP_Query + CPT block
Local Blueprint inc’ Block Templates
robstinson.co/decode-custom-blocks/
19
Thank you.
carriedils.com
WordPress Developer
Carrie Dils
WP Engine
Product Marketing
Rob Stinson

The Fast Track to Mastering Modern WordPress - Rob Stinson & Carrie Dils

  • 2.
    carriedils.com WordPress Developer WP Engine ProductMarketing Carrie Dils Rob Stinson The Fast Track to Mastering Modern WordPress
  • 3.
    3 Agenda. 1. Introduction toFull Site Editing 2. Blocks are the future of WordPress 3. Full site editing themes 4. Timeline for FSE 5. Building custom blocks (live coding demo)
  • 5.
    “ “Gutenberg” is acodename for a whole new paradigm in WordPress site building and publishing, that aims to revolutionize the entire publishing experience as much as Gutenberg did the printed word.
  • 6.
    6 The project hasfour phases: 1. Easier Editing 2. Customization 3. Collaboration 4. Multilingual Gutenberg
  • 7.
    7 The project hasfour phases: 1. Easier Editing 2. Customization 3. Collaboration 4. Multilingual Gutenberg
  • 8.
    8 The project hasfour phases: 1. Easier Editing 2. Customization 3. Collaboration 4. Multilingual Gutenberg
  • 9.
    9 Core Editor Blocks CommonBlocks Formatting Blocks Layout Elements Widgets Embeds
  • 10.
    10 Full Site EditingBlocks Header Blocks Post Blocks Comment Blocks Query Blocks Structural Blocks Navigation
  • 11.
    11 • Wide imagealignment • Editor color palette • Editor text size palette • Responsive embeds • Frontend & editor styles • etc... “Gutenberg Optimized” themes
  • 12.
  • 13.
    13 WORDPRESS 5.7 Now inBeta 1 FSE is still experimental • Includes Gutenberg Versions 9.3 - 9.9 • Breaking change to experimental-theme.json structure • Need to use Gutenberg plugin for experimental features including Navigation and Widgets • Includes API endpoints for core block pattern directory COMING MARCH 2021 WORDPRESS 5.8 FSE “MVP” is in core • Will include Gutenberg versions 9.10 - ?? • “The MVP should make it possible to build a version of the Twenty Twenty-One theme, using only blocks, without any coding knowledge.” - Josepha Haden Chomphosy • The “six milestones” COMING JUNE 2021 Timeline for FSE
  • 14.
    Custom Block Building WithGenesis Custom Blocks
  • 15.
    ● A WordPressplugin that provides an admin interface and a simple templating system for building custom Gutenberg blocks. ● Blocks that Look & Function EXACTLY as you need. ● NOT dependant on the Genesis Framework.
  • 16.
  • 17.
  • 18.
    Enough talk. Let’sbuild some stuff! 1. Simple notification block 2. Hero block 3. Loyal (Woo) Customer block 4. WP_Query + CPT block
  • 19.
    Local Blueprint inc’Block Templates robstinson.co/decode-custom-blocks/ 19
  • 20.
    Thank you. carriedils.com WordPress Developer CarrieDils WP Engine Product Marketing Rob Stinson