WordPress 5.9 has been released and with it, the new ‘Block Themes’. While the idea in and of itself isn’t anything new, I was excited to see WordPress finally step into the realm of what I considered an actual CMS to be. Finally, a native solution to page building that doesn’t require plugin after plugin to create a hacked-together experience. But is this really the solution we have all been waiting for? Well, allow me to share my professional yet personal opinion.
Post sections…
Editing a Theme From a Casual Users Perspective
Now I want to clarify that this isn’t a tutorial on how to use the editor, but more of an objective overview of the editor along with pros, cons, and everything in between. Please also understand, I am fully aware of the page-builder plugins available but this is simply looking at WordPress’ previous page building workflow vs its new Block Theme approach.
But let’s start by saying the new ‘Block Editor’ can be initially daunting despite the minimal UI (user interface) WordPress gave it. For the average WordPress user, this will be a completely new way of editing pages. However, I think that after spending some time with it and getting used to how everything works, you’ll find that it’s not as bad as you might have thought especially since the learning curve isn’t as steep as other solutions out there.
Editor Pros (From a Users Perspective)
1) In-page editing
In-page editing has to be one of my favorite features of this new editor. Not only can you edit the content of a page, but also the layout and design. For example, if I scroll down to my hero image on this page and click inside it, I now have an editor displayed that lets me change the image, text, and (depending on the theme) the size of the text. Intuitive design and a solid win for WordPress.
2) Menu Editing
I can’t tell you how annoying and cumbersome I found the previous menu/navigation building system… but all that has changed. To go hand-in-hand with the in-page editing, simply click on the menu link, change the text, location, or even add a submenu link all within the block editor. I can’t tell you how relieved I am that they scrapped their old workflow. This is definitely a welcomed change.
3) Freedom To Add Actual Webpage Components
This meant the world to me seeing as I create and manage WordPress themes for a few clients. The fact that the casual user can now add a hero banner (again, depending on the theme) by simply dragging a block out is simply wonderful. No more plugins, no more hacking things together to attempt to make it look cohesive. It just works.
Editor Cons (From A Users Perspective)
1) The ‘Blocks’ Are Simple
I understand this is in Beta and I am sure the ability to create elegant image sliders, modals, pop-ups, etc. will come in the future but as of this moment, the blocks feel just like the name sounds. Static content with minimal life to them. I’m hoping that in the following releases, the blocks will have a bit more ‘flare’ to them.
2) The Editor Is Still Clunky At Times
While I appreciate that WordPress has made great strides with its editor, it is still… clunky. At times you’ll find yourself searching for things that just aren’t there. For example, if you want to add an image into a block, you have to search for the ‘Media’ icon and then upload the image. No drag and drop support here which can be frustrating when all you want is to quickly add that new featured image.
A Few Tips
The ‘List View’ is essential when building. While it may appear daunting when looking at your web page in a tree-like view, it is so helpful to not only quickly navigate to elements you wish to change but to re-arrange those same elements.
Creating a Block Theme From a Developer’s Perspective
If I could sum this up, I would have to say:
No god! No god please no! No! No! Noooooo!
~ Michael Scott
And I mean that. While the idea is incredible, I must say I am greatly disappointed in the approach they took to execute this feature. I have been forcing myself for the last two weeks to try and come to terms with this format thinking that maybe this is just an adjustment period. But no… that is not the case.
Block Theme Development Pros
… *crickets chirping*
Block Theme Development Cons
1) The HTML isn’t really HTML…
<!-- wp:group {"layout":{"inherit":true}} -->
<div class="wp-block-group"><!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"bottom":"var(--wp--custom--spacing--large, 8rem)","top":"var(--wp--custom--spacing--small, 1.25rem)"}}},"layout":{"type":"flex","justifyContent":"space-between"}} -->
<div class="wp-block-group alignwide" style="padding-top:var(--wp--custom--spacing--small, 1.25rem);padding-bottom:var(--wp--custom--spacing--large, 8rem)"><!-- wp:group {"layout":{"type":"flex"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"width":64} /-->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"italic","fontWeight":"400"}}} /--></div>
<!-- /wp:group -->
<!-- wp:navigation {"layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"right"}} -->
<!-- wp:page-list {"isNavigationChild":true,"showSubmenuIcon":true,"openSubmenusOnClick":false} /-->
<!-- /wp:navigation --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->Above is an example of the HTML written for the ‘header.html’ file in the WordPress TwentyTwentyTwo theme.
I was so unbelievably excited when they announced that template parts were going to be HTML documents. I expected to simply write out an HTML block for a particular part of the page like a hero banner and then inject some theme snippets to create some customization functionality for the user (similar to Shopify’s liquid sections). What we ended up getting was the most garbled mix of HTML comments / embedded JSON I have ever seen. Reading a block is a nightmare. If you try to comment on your code to know which piece does what, you will get even more lost because WordPress requires these strange comments to help render the HTML you have written. It’s just not all that fun.
2) Creative Freedom Is Lacking
To build off of the con from the user’s perspective, the lack of creativity that we can add to these blocks is completely frustrating. I understand WordPress end result is to make the result as easy as possible for the user but with that, creating custom blocks such as unique galleries or even image sliders becomes unnecessarily complex.
3) Inline Styles
Maybe this one is just me but I greatly dislike using inline styles on elements. But with WordPress’s block themes, that is how you are going to give some creative freedom to your users. For instance, spacing elements requires inline CSS declaring the padding which by itself isn’t a big deal. But when you have a page full of different elements, columns, and rows, your HTML starts to look pretty sloppy. Again, I may sound like an HTML purist but I do appreciate clean code.
In Conclusion…
Is the WordPress 5.9 ‘Block Theme’ solution we’ve all been waiting for? For the average WordPress user, I would say absolutely! But for the theme developers, my opinion would be a strong no. I am excited to see where WordPress takes this new tool but I am praying to the developer gods that they take a new approach to create theme blocks.
I will continue to experiment with the new block editor and should I discover anything new, I will happily share the details here. But what are your thoughts? Do you like the new editor / developing for this new editor?
Leave a Comment