Define Gutenberg Attributes in PHP

In WordPress 5.0, the editing experience will be changing dramatically. I’ve written information for my clients about this change in Prepare for WordPress 5.0 (Gutenberg).

With the editor moving from one general purpose editor field to a series of special purpose blocks, there will be a need for creating custom blocks. In another post, I’ve explored building WordPress Gutenberg blocks without npm.

In all of the information I’ve found on creating custom blocks, the examples define the attributes (values within the block that can modified), in JavaScript. At first blush, this makes a lot of sense since Gutenberg has been advertised as a new JavaScript powered editing experience that more or less leaves the backend (PHP) code and database entries alone.

Through this tweet by Jason Bahl

Next step: custom block without writing and custom JS at all…just use the (not really existent) Server Side Registry to define blocks and let whatever client (Gutenberg, iOS/Android, WP-CLI) interact with the blocks. 😀…one day, hopefully 🤞

— JSON Bahl (@jasonbahl) May 17, 2018

I learned attributes can be defined in PHP rather than in JavaScript – but why?

Gutenberg as More Than an Editor

As mentioned, Gutenberg is typically described as a new editing experience however in Gutenberg Issue 2751, Jason and others outline an argument for defining blocks on the server side with rules for interacting with blocks. There is a lot of good discussion in the issue and I recommend reading it. In broad strokes, the idea is to define blocks on the server side and then expose ways to interact with these blocks. This would allow the new block based editor to interact with blocks but would also open the road for other ways to interact with blocks (e.g. a native mobile app, WP CLI, an indexing service, or even an alternate JavaScript based editor).

Moving Along this Path

In a first step towards this language-agnostic schema for blocks, attributes can be defined in PHP (instead of JavaScript). Ultimately, if the project embraces server side registry in this way, attributes definitions and other parts of the block JavaScript will move into PHP, since the server will need to be aware of them. Based on my hope the project will move in this direction, I’ve started defining my attributes in PHP.

Photo Credit

Eric May

Sal Ferrarello (@salcode)

Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.