Justin Tadlock
And another theme shop hops on the block bandwagon. Catch Themes’ first block-based theme, Catch FSE, landed on WordPress.org over the weekend.
The company is one of the most prolific authors in the official WordPress theme directory, touting a total of 109 themes. There are only a few others with such an impressive body of work, at least in sheer numbers. Averaging over 10 new releases each year for the last decade is no small feat, and that just accounts for the company’s free themes.
At a time when WordPress is still in a transitioning phase between classic, PHP-based themes and those built entirely from blocks, the community needs leaders in the space pushing the project forward.
With WordPress 6.0’s slew of features, I expect we will see more and more authors join the ride.
When reviewing new themes, I typically install them a few days ahead of time and test them off and on. Then, I decide if they are worth sharing with the Tavern audience. However, in this case, I am going in blind. Well, not entirely blind. I am familiar enough with some of Catch Themes’ past work to know the company has produced some well-designed projects. Plus, I had quickly peeked at the demo.
My immediate reaction after installing and activating Catch FSE was disappointment. The homepage did not look like the theme’s screenshot or what was shown in the demo. Instead of the business-friendly layout I expected, I gazed upon a standard blog post listing.
This should not be happening in the block themes era.
Theme authors are not entirely at fault for this problem. Those who have submitted their designs to WordPress.org have been conditioned over the years to do this. This was a necessity in the classic theme era because users did not have the same control as they do now over their homepages. The site editor gives them that freedom, and it also breaks the shackles that have been holding theme authors back for years.
Now is the time to be bold. Now is the time for theme authors to put their signature on their work, showcasing their design skills with those custom homepages they have always wanted to provide out of the box. Now is the time to break free of those draconian guidelines from an era that block-based themes are leaving behind.
Catch Themes, if you are reading this, I want to see a front-page.html template in version 2.0 that outputs the following:
Give users an immediate solution instead of forcing them to create a new page, select a template, and move into the template editor to customize it.
A blog post listing is a perfectly acceptable default for a theme, and Catch FSE’s works well enough—those gradient “read more” buttons are also sweet. However, if the screenshot and demo showcase a custom homepage, that is what I expect to see upon activation. And, based on my somewhat educated guess, it is also what the average user will expect.
After tinkering around with the theme for a while longer, I realized how well-designed it was. The typography made for an enjoyable reading experience. Each template was well laid out. The footer “widgets” even felt right. Catch FSE was suddenly making a beeline toward the top of my favorite themes list this year.
And, I must take another moment to appreciate the gradient used for buttons in the theme, as shown in this screenshot of the About Us pattern:
Those who have followed me long enough know that I often dislike dark designs. Automattic’s Livro made me rethink my position earlier this year. With Catch FSE, I am moving beyond merely tolerating such designs to enjoying them. Well, some of them. Let’s not get crazy.
What Catch FSE does as well as any theme is offer a well-designed set of block patterns. In total, it ships 15 that users can pick and choose from.
From a development perspective, other theme authors should take notes. Following the DRY principle, Catch FSE routinely reuses its own patterns in its templates and parts.
The theme registers 10 block styles, but it is impossible to know what most of them do without trying them out first. The user-facing label simply reads “Theme Style” for eight of them. What does that even mean? If it is the theme style, should it not be the default?
Most are generally design variations for the various blocks they are attached to. They might alter the typography, colors, or other styles, as shown in the following screenshot of the Blockquote block with the “Theme Style” assigned to it:
That is actually a well-designed Blockquote style, but I would have never known it was something I would want to use if I had not been digging. Custom block styles suffer from a bit of a discoverability problem by default, and cryptic names for them are doing users no favors.
Most of the issues I had with the theme were around the comments list design. However, it is not yet using the new Comments Query Loop block shipping with WordPress 6.0. In a future release, I would like to see the author put more time into bringing it up to par with the rest of the theme’s design. At the moment, it feels like a feature that was tacked on as an afterthought.
Catch FSE is a freemium theme with a commercial add-on plugin that offers three custom blocks and 10 patterns. I like seeing the upsells focused purely on value-adds.
I have often said that the next generation of freemium themes cannot be like the last. Developers will need to focus on enticing users with solutions to their problems instead of nickel-and-diming customers, locking necessary features behind a paywall. The block system is changing the game, and when most users can flesh out their site designs via the built-in WordPress site editor, the old-school upsells will not cut it.
Turnkey, plug-n-play solutions are needed. I may be so far off-base that I am not even in the ballpark, but I foresee block patterns being a central part of that. Once commercial theme authors figure out how to market and build with these new tools, we will see an explosion of growth in the block-based themes space.
Catch Themes’ 10 commercial patterns represent a start, but I imagine the company will need to continue pushing limits to see a worthwhile return on its premium upsell. Now is the time for experimentation while the field is wide open.
My biggest nit-pick? The name.
Attention all developers: Can we stop naming themes “Something FSE” and “Guten Something”? It is confusing and makes it tough to remember which project is which. Take some time to come up with something that stands out in the crowd.
Catch FSE is a bold and beautiful business-ready theme, but it needed a name to match its personality. I only hope folks remember it.
Hi,
Nice theme. I found some issues though that are maybe not related to this theme.
First, if I select “FrontPage Template”, whatever I enter on the page is not displayed. Then I figured out that I should click the small “Edit” link to edit the template itself.
Second, when I try to add a pattern, many patterns that are not part of this theme as displayed as “Featured”. The use of some of them leads to various problems (white text on white background, etc.). Don’t you think, by default, there should be the theme’s patterns displayed first?
Last but not least, when I create a regular page (with a Default template), I found it difficult to remove the big header (with page name). Again, I released I have to edit the template. Maybe there should be a template similar to Default but without a big header.
I am writing this as someone who is new to FSE and block themes. I am a long time in development so I figured out how to fix the issues above. However, it’s won’t be easy for less experienced users and our clients who want to maintain websites themselves.
Keep up the good work.
Best,
Milos
Hi, Milos. Thanks for commenting and leaving valuable feedback. You are right that these issues are mostly unrelated to the theme itself. Most sound like they are more specific to full-site editing features in WordPress.
Before diving into the specifics, I also highly recommend checking out Learn WordPress. This workshop on the page vs. site editor may be helpful.
First, if I select “FrontPage Template”, whatever I enter on the page is not displayed.
This is how page templates have worked with both classic and block themes. It is actually one of the longstanding problems I have had with the page template system—there’s no way to communicate to the user whether the template supports displaying the page content.
However, I think there’s an opportunity with blocks, which are built on a standardized system, for WordPress to show a message to the user if the Post Content block is not used in the template. I’ll look into drafting a ticket to see how this might be improved in WordPress.
Then I figured out that I should click the small “Edit” link to edit the template itself.
Yes, this multi-step process is what I briefly described in the post as problematic. I would have rather seen the theme use WordPress’s built-in front-page.html template support instead. That way, there would be only one place to make edits.
Second, when I try to add a pattern, many patterns that are not part of this theme as displayed as “Featured”. The use of some of them leads to various problems (white text on white background, etc.). Don’t you think, by default, there should be the theme’s patterns displayed first?
The “Featured” category comes from WordPress itself rather than the theme. It’s possible for themes to manipulate this and only show their own. The theme does have a “Catch FSE” category that lists all of its patterns.
I do think this is an important point about the default user experience. In my mind, I want that first featured category to show theme-specific patterns rather than those from WordPress.org.
Last but not least, when I create a regular page (with a Default template), I found it difficult to remove the big header (with page name). Again, I released I have to edit the template.
You should be able to edit the page template from Appearance > Site Editor too. I personally find this easier to work from than the template editor while editing a post.
Maybe there should be a template similar to Default but without a big header.
That sounds like a reasonable feature request from the theme author. I’ll ping their team to let them know.
The issue with a front-page.html template is that it does not respect the default “Your homepage displays: Your latest posts” setting in Settings > Reading.
It’s true that in the classic era, themes (submitted to .org) did need to respect the Reading Settings, and yes it’s possible that theme authors have become conditioned* into this way of thinking, but it can be super confusing for users when the homepage does not display the latest posts if this is what they expect.
Maybe the default to latest posts and the page_on_front and page_for_posts options should be removed/disregarded when a block theme is active?
*How can I be sure that what I am saying and my reluctance to include a front-page.html template is 100% my own thought or whether there is some conditioning at play here?? At this point how do I know the difference?
Recently another theme author asked my opinion on this very subject. My advice was basically the exact opposite to what you are saying in this article Justin, but over the past couple of weeks I have been giving it some thought and I’m not opposed to change my thinking if the legacy issues could be made less confusing.
There’s also the issue of content directly in the template. Surely a template is a template and not itself the content?
Based on my experience (and this is mostly anecdotal from other theme authors), users are more likely to expect their front page to show what the theme shows in its screenshot/demo. “Recreating the demo” has long been an issue in the WordPress theme space, particularly with front page designs. Of course, you are aware of this already (just laying out for others who are reading).
I actually do want WordPress to remove the “show on front” setting for block themes (there are other settings too). If the long-term goal is to have more of a unified admin, it makes sense that there is only one place to control something like the front page output. Currently, there are two places without a way to see how these work together.
Even in the scenario where the reading settings are followed, users may still need to hop over to the site editor to make adjustments to what’s shown on the front. Essentially, WordPress needs to address the user experience around this, but I think it’s OK for themes to start forcing the platform’s hand on this.
The site editor is also the promise of Gutenberg from 5 years ago. When trying to bring theme authors on board with blocks, the promise was that we would get to a place where they could just have a front page that was automatically configurable without jumping through all the hoops of the past.
My alternative recommendation is (and I should have mentioned this in the post) for themes to offer the “front page” as a full-page pattern. This will be an even stronger recommendation after 6.0’s new page + pattern starting point. This may very well become my go-to response in the future, and it would also solve the other problem:
As far as content vs. templates go, yes, that is also a issue with building templates in general (also one of the reasons I lean into patterns). At least in the case of the “typical” front page, that is often minor content that is likely to be changed based on the theme itself rather than site content. Of course, there are cases on both sides of the spectrum.
Thanks for commenting, Andrew. Great food for thought around things that we all need to figure out. It’s discussions like these that we need to shape the future of block themes.
How does this compare with the likes of Astra and the standard block editor?
Enter your email address to subscribe to this blog and receive notifications of new posts by email.


WordPress Tavern is a website about all things WordPress. We cover news and events, write plugin and theme reviews, and talk about key issues within the WordPress ecosystem…
© All Rights Reserved. Powered by WordPress, hosted by Pressable

Affiliate Marketing As A Business

source

/ Uncategorized

Leave a Reply

Your email address will not be published. Required fields are marked *