As presented at WordCamp NYC on Sept 14th, 2019.
Now that we’re more than six months past the Gutenlaunch, how is the new WordPress editor faring in the real world?
In short, the answer is brilliantly.
In this talk I go through some of the most exciting and interesting developments on and around Gutenberg, including real production examples from our clients as well as others.
We’ll cover core blocks, block libraries, block-aware-themes, and custom blocks.
If you’ve held back from embracing the block, come see why it’s time to start planning your own gutenswitch.
5. @jeckman
Gutenberg Improvements
• 5.0: RSS Block, Kindle Embed Block, Focal Point Picker
• 5.1: Search, Calendar, Tag Cloud Blocks; Micro-
animations; Widgets-to-Blocks complete
• 5.2: @wordpress/block-editor module
• 5.3: block management, nested blocks, legacy widget
• 5.4: Vertical alignment in columns, playsinline video,
improved hover state
• 5.5: Group block, vertical alignment and image fill
options in Media & Text block
• 5.6: Improved focus state, simplified style specificity
• 5.7: Width setting in column block, show post content
or excerpt in Latest Posts; headers and footers in table
block
• 5.8: Change text color in heading block, reorder gallery
images, widgets screen POC
• 5.9: Snackbar notices, group block
• 6.0: predefined layouts in columns block,
improvements to group block
• 6.1: Using motion/animation when moving blocks
• 6.2: Nesting cover and media & text blocks, button
block customization
• 6.3: A11y support for navigation and edit modes
• 6.4: Resize and background color for Cover block,
typewriter experience, circle crop on image block
https://wpengine.com/blog/gutenberg-a-six-month-feature-update Photo by Guilherme Cunha on Unsplash
9. @jeckman
“More recently, Array’s Atomic Blocks library has emerged as
a go-to source for creative, easy-to-use Gutenberg blocks that
leverage the new WordPress editor. Atomic Blocks is the
most popular and most downloaded library of beautiful,
responsive, and customizable blocks for Gutenberg. It
allows users to add great-looking elements to their web
pages at significantly reduced turnaround times that convert
at higher rates, all without touching a line of code.”
https://wpengine.com/blog/bringing-array-themes-into-the-wp-engine-family/
11. @jeckman
“Effective today, Rich Tabor is joining GoDaddy to
help lead innovation around Gutenberg.”
“CoBlocks and ThemeBeans are joining the
GoDaddy family.”
https://www.godaddy.com/garage/coblocks-themebeans-tabor/
37. The Rockefeller Archive Center is a major
repository and research center for the
study of philanthropy and its impact
throughout the world.
In addition to the papers of the
Rockefeller family, the RAC's collections
include the records of the Rockefeller
Foundation, Ford Foundation, Near East
Foundation, Commonwealth Fund,
Rockefeller Brothers Fund, Henry Luce
Foundation, W. T. Grant Foundation and
many other philanthropic organizations.
Rockefeller
Archive Center
41. @jeckman
Lessons Learned
• Use Gutenberg to force component based designs & design systems
• Aim for direct manipulation of visual objects - but balance that with the
flexibility of attributes and inspector controls
• Extend core blocks where possible instead of remaking them
• Combine blocks into groupings
• The “reusable blocks” feature is amazing but needs improvement
Photo by Roman Mager on Unsplash