Reusable Blocks are Patterns too, Style Book, Block Handbook Navigator and Command Center—Weekend Edition 258

Howdy,

It’s been a more quiet week. Many people have been working hard to get the latest features into the next Gutenberg release, so they can also be merged with WordPress 6.3. If you want to start testing, the Gutenberg 16.1 RC is available here. The changelog is massive. Next week, Tammie Lister will be going over this with me when we record the next Gutenberg Changelog.

On Friday, I’ll hope on a train to Leipzig and give a presentation to the attendees of the back-to-the-roots, no frills WordCamp. Added thrill for me: it’s my first time presenting in German about technology. Oy.

Next week is also WordPress 6.3 Beta 1 release. Get ready for testing and filing bug reports! The best way to learn what will be in 6.3 is by using the beta version and heed the Testing Call #24: Momery Makeover. Testing a new version pre-release, is an open-source contribution with the highest impact. If you are keen to learn how to do it, please let me know and I do a short tutorial zoom with you.

This weekend edition seems rather short, too

Yours, 💕
Birgit

Join us for the next Gutenberg Live Q & A July 6th, 2023, at 17:00 UTC

Leveraging Gutenberg’s architecture to take plugin development to new levels.

Learn how Gutenberg components and scripts can be used outside the block editor to revamp a plugin’s code base in this Case Study of GiveWP 3.0 with Jason Adams, Director of Development, Jon Waldstein, Lead Developer of GiveWP and co-host Lena Morita, JavaScript Developer on the Components team.

Developing Gutenberg and WordPress

🎙️ Latest episode: Gutenberg Changelog #90 – New Testing Call for the FSE Program, Gutenberg 16.7 and WordPress 6.4 with Tammie Lister as special guest, hosted by Birgit Pauli-Haack

In his latest Design Share: Jun 5–Jun 16, Joen Assmussen shares the work of the WordPress Design team on the

  • flow of creating patterns via the Site Editor,
  • Top Toolbar refinements,
  • ideas on how to customize the Drop Caps,
  • more customization tools for the list blocks,
  • Home template details panel
  • Site editor publishing, and
  • Interesting mock-ups for a redesign of the Learn.WordPress pages.

Plugins, Themes, and Tools for #nocode site builders and owners

Jamie Marsland shared in his latest video, WordPress Block Theme Secret Hacks You Didn’t Know Existed, five secret features of Block Themes, you might not know about. Marsland also offers a Block Theme course: Mastering Site Editing and WordPress Block Themes, so you can get a head start.


Wes Theron also shares his secrets, too in the tutorial Using the block editor: Tips and shortcuts for efficiency on Learn WordPress. He has eight tips and shortcuts for you to work faster and more efficiently in the block editor.



In this video on WordPress TV, Kathryn Presner and Sarah Snow showed their students how to Create a four-page WordPress website: Explore Plugins + Contact Forms. Watch this workshop to learn about plugins–how to find them, how to vet them, what can go wrong–in WordPress in 2023.


Another new feature is coming to WordPress 6.3, the Command Center. Be aware that’s only the working title and contributors discuss renaming it. Sarah Gooding reports on the discussion WordPress Contributors Discuss Renaming Command Center Tool.

Reusable blocks are now called Patterns

Creating patterns using the block editor has been one of the most requested features since Patterns have been available and since the release of the Pattern directory on WordPress.org in Summer of 2021. It’s now coming to the editor in WordPress 6.3 version. It uses the same workflow as creating reusable blocks. To remind you: create a collection of blocks, group them, and use the 3-dot menu “Create reusable Block” except it now says “Create custom pattern”.

Turns out Patterns and Reusable blocks are cut almost from the same cloth. The only difference is that the change to a reusable block synchs over all the instances the block has been used, hence the new name “synched pattern”. There is now a toggle switch to “Keep all pattern instances in sync” or not. This is the first iteration: the name change and the creation workflow.

To re-use the pattern, you find them in different places, though. Synched patterns are listed in the list of Blocks in the Inserter and available via slash “/” command. Unsynched patterns are in a new Pattern category = Custom Patterns in the Patterns Tab in the big blue button inserter.

There are many users, and I might be one of them, who find patterns, should also be at least partially sync-able. That feature is planned to come to the block editor after WordPress 6.3 is released. It will take a few more thoughts on how to separate the various pieces. You might want to synch the design but not the words, or styles but not the images. The headings but not the links. And immediately you see that this can be quite complicated. So, it might take some more time. You can read up on the genesis of this new feature in the PR Reusable blocks: Rename to ‘Patterns’ and add option to also add a non-synced Pattern. (51144)

Theme Development for Full Site Editing and Blocks

Ganesh Dahal, also writer at CSS-Tricks, published his first article on the WordPress Developer Blog about The Style Book: a one-stop shop for styling block themes. The Style Book is the new one-stop Global Style feature of the Site Editor that allows you to add all global or per-block design elements with a live preview window. This also lets users create a new set of variations that they can modify with a single click.


Wrestling with a huge theme.json might deter people from creating block themes. Petter Walbø Johnsgård developed the npm package @theme-json/create that helps you with that. It allows you to create a logical directory structures to separate out various parts of the theme.json. It makes it easier to maintain and quickly navigate to the necessary area you wish to modify. This way you can standardize variables and reference them in our theme.json, and makes it them much more maintainable when designers decide to make changes. (Thank you to Marius Jensen for the tip).

 “Keeping up with Gutenberg – Index 2022” 
A chronological list of the WordPress Make Blog posts from various teams involved in Gutenberg development: Design, Theme Review Team, Core Editor, Core JS, Core CSS, Test and Meta team from Jan. 2021 on. Updated by yours truly. The index 2020 is here


In his post for the Torque Magazine, How to Add Widget Areas to WordPress (Block & Classic Themes), Nick Schäfferhoff took a look at different ways to add widgets to your WordPress theme. You learn how to use widgetized areas and create new ones in classic themes, as well as how to make widgets show up in your block themes.

Building Blocks and Tools for the Block editor

It might be the post you have been waiting for. In his post on How to Navigate the Block Editor Handbook, Michael Burridge leads the way with Compass and Maps so to speak. “The Block Editor Handbook is intimidating even for seasoned developers. If you are new to block development, you’re likely to feel completely overwhelmed. This guide will help you find your way around the Block Editor Handbook. It suggests a learning path that will help you become an expert in no time.” he wrote in the excerpt


Brian Coords published a tutorial about Custom Lists in WordPress with Register Block Style. He explains how to work with Block styles without a build process. It’s a great way to learn to customize the blocks without any JavaScript and very little php.

Earlier this year, Justin Tadlock wrote about Creating custom block styles in WordPress themes, that could be another great tutorial for you.


Need a plugin .zip from Gutenberg’s master branch?
Gutenberg Times provides daily build for testing and review.
Have you been using it? Hit reply and let me know.

GitHub all releases

Questions? Suggestions? Ideas? Don’t hesitate to send them via email or send me a message on WordPress Slack or Twitter @bph.

For questions to be answered on the Gutenberg Changelog, send them to changelog@gutenbergtimes.com


Featured Image: Skyline of Athens, view of the Acropolis from the roof of the Museum for contemporary art by Birgit Pauli-Haack


Don’t want to miss the next Weekend Edition?

We hate spam, too and won’t give your email address to anyone except Mailchimp to send out our Weekend Edition

Thanks for subscribing.