Unlocking the full potential of WordPress: Moving past Hybrid Themes


Hi Reader,

This week I completed all the WordPress 6.6 updates for my Block Theme Academy course.

And I did something I never did before: I removed content (it's now archived on my website).

Since the first version of the course was published three years ago, WordPress kept adding more and more features. And that meant more and more lessons.

But technology doesn't exist in a vacuum. I'm not just interested in showing how WordPress works; I'm more interested in what you can do with it.

My interest is in building custom websites for clients, and part of that is designing maintainable and future-proof themes.

And keeping this in mind, it's time that we say goodbye to some of our development approaches.

And one of these is hybrid themes.

The original promise of hybrid themes

Hybrid themes were originally meant to allow developers to solve two problems:

  1. Use Full-Site Editing features before the Site Editor was added and made stable in WordPress Core.
  2. Keep existing features built using classic tools like the Customizer.

The idea was that hybrid themes would be a logical stepping stone toward block themes.

And I bought into this idea as well. There are two main issues with adapting any new technology:

  1. You need time to learn the new ways of doing things.
  2. You need a way to put this new knowledge into practice.

Freelancers and agencies already have enough on their plates. So, they need to continue delivering work while upskilling, which limits the time and energy available for learning.

They must also keep projects on time and within budget, so they can’t suddenly completely change building approaches.

So, I devised my approach to gradually modernizing theme development without any risks. I called it Blueprint to Blocks.

The reality of building block themes

In reality, hybrid themes faced two main issues.

First, many developers never took the step to go further with blocks. Still today, I see client projects being built entirely using PHP templates. Blocks are relegated to content and a few landing pages.

This wouldn’t be as much of a concern if these themes wouldn’t miss out on all the performance improvements delivered through block themes.

With more features moving to the Site Editor, the user experience becomes fragmented. WordPress 6.6 brings patterns to classic themes. The experience is quite unsettling, and the Site Editor interface feels foreign within this context.

At this point, modern and classic WordPress are diverging quite a bit, and this will only continue.

The second issue is that, contrary to the accepted dogma among certain parts of the community, hybrid themes are actually harder to build than block themes.

Let’s take the content and wide alignments, for example. It is one of the most basic features that has been around for years.

In a block theme, all you have to do is add the sizes to theme.json, and then everything will work as expected, whether in the editor or on the front end.

The editor will work in a hybrid theme, but the frontend won’t. There are good reasons why, and somebody with solid block theming experience will understand these.

But this is in opposition to what hybrid themes were supposed to be. An onramp for developers without much block theming experience.

To make things worse, as the styling tools in block themes evolve, WordPress keeps adding ways to allow classic themes to remove these improvements. While these improvements work without any issues in block themes, they will surely interfere with existing classic theme CSS.

WordPress 6.6 changes the specificity of the generated CSS. I haven’t seen any issues with websites running block themes when updating to WordPress 6.6, but I know that most hybrid websites that still rely heavily on CSS will be affected.

This leads to the view that WordPress Full-Site Editing is unstable or “breaks sites.” However, since the release of WordPress 5.0, the WordPress team has told developers that they shouldn’t rely on the block markup and CSS staying the same between versions.

A tough but necessary change

When I work on clients' websites, I pride myself on telling them what they need to hear instead of what they want to hear.

And when it comes to teaching modern WordPress development, I should do the same. My doubts on the validity of hybrid theme development approaches have been brewing for a while. Already in July 2022 I wrote about this topic in my newsletter

Plus, I teach what I know. I haven't built a new hybrid theme in a long while, so my knowledge of the best practices here might no longer be valid.

So, if you’re reading this, my recommendation is clear: Create a plan to stop building hybrid themes over the next six months.

What exactly are the reasons for this building approach?

  • Are there technical obstacles?
  • Do you need a new starter theme?
  • Is there a particular area you need to learn more about?
  • Do your clients need more training on how to use these new features?

Take an hour from the screen and dump all of this on paper. Then, clean them up, sort them by order of importance, and work out a plan for tackling these issues one by one.

Key aspects to consider:

  1. What training resources do you need?
  2. How much time will this require?

Armed with this, you can devise a plan that provides the desired smooth onramp to block themes.

Remember that building block themes does not mean saying goodbye to PHP-based implementations. With its server-side rendered custom blocks, ACF blocks, or Core blocks connected to post meta: lots of block-based options exist.

However, the content creation, template building, and design system should all be block-based.

And trust me, once you’ve made the switch, you won’t be going back.

Cheers,
Fränk

P.S. Joining the Block Theme Academy course gives you exclusive access to our community on Teachable.

Connect with me and fellow students to get support and answers to your questions. Don’t miss out on this valuable resource to enhance your block theme development skills!

Fränk Klein from WP Development Courses

Every Sunday, I send out tips, strategies, and case studies designed to help agencies and freelancers succeed with modern WordPress. My goal is to go off the beaten path, and focus on sharing lessons learned from what I know best: building websites for clients. 100% free and 100% useful.

Read more from Fränk Klein from WP Development Courses

Hi Reader, summer time in Europe means holiday season. And that means lots of time spent traveling. So why not benefit from all that time you need to sit in a car, bus, train or plane, and learn something? Which is why I'm sharing four podcast episodes I recently listened to, and enjoyed a lot. A Deep Dive into Block Bindings, APIs, and the LSX Tour Operator Plugin with Ash Shaw In this episode of Woo DevChat, hosts Zach Stepek and Carl Alexander chat with Ash Shaw from Lightspeed about the...

Hi Reader, what you are reading now took me a long time to write. In fact I started over three times. The question I'm trying to answer is simple: What's it like to be a WordPress developer in 2024? And by extension of course trying to deduct the future from that. The challenge here is that I want to: Warn about the dangers for your career without wanting to create panic. Encourage you to grow your skills without sounding too negative about your current situation. It's not about Full-Site...

Hi Reader, WordPress has many useful blocks, some not-so-useful ones, and a few that really shouldn't be there anymore. Like the Spacer block. Although the Spacer Block might seem like a simple solution for adding space to pages, it has several drawbacks that can negatively impact your website's performance, design, and accessibility. Understanding the Spacer Block The Spacer block shipped with WordPress 5.0, released on December 6, 2018. Back then, it was the only block-based option for...