Current State of Block Themes  ## Metadata - Author: [[David McCan]] - Full Title: Current State of Block Themes - Category: #articles - Document Note: --- tags: [#blockThemes, #WordPress, #webDevelopment] - #blockThemes - #WordPress - #webDevelopment Author: David McCan / Web TNG Source: Transcript for [Current State of Block Themes](https://www.youtube.com/watch?v=WtZ3yZ7HPvE) Reference: YouTube transcript with timestamps date created: 2025-03-02 12:45 --- # 📚 Title: Current State of Block Themes in WordPress: Popularity, Structure, and Future Directions ## 🗂️ Table of Contents: - [📝 Summary](#-summary) - [📖 Main Content](#-main-content) - [🗒️ Notes](#-notes) - [📖 References](#-references) - [🗣️ Paraphrase](#-paraphrase) - [📰 Newsletter](#-newsletter) - [✅ Action Items](#-action-items) - [🧪 Hypotheses](#-hypotheses) - [📊 Methodology](#-methodology) - [❓ Questions](#-questions) - [🔮 Future Research](#-future-research) - [💡 Implications](#-implications) - [🧠 Learning Styles Assessment](#-learning-styles-assessment) - [📊 Accessibility Assessment](#-accessibility-assessment) - [🌍 DEIB Assessment](#-deib-assessment) - [✅ Logical Validity](#-logical-validity) - [🔍 DARVO Analysis](#-darvo-analysis) - [🔍 SEO Evaluation](#-seo-evaluation) - [🎯 Conclusion](#-conclusion) ## 📝 Summary: - This transcript by David McCan provides a comprehensive overview of the current state of block themes in WordPress. - It examines the rising popularity of block themes, details their shared structure (notably the use of theme.json), and discusses both their flexible features and existing UI challenges. - Key insights include the popularity of Core themes (e.g., Core 2024, 2023, 2025), the role of third-party themes bundled with hosting services, and emerging trends to improve usability. - Direct timestamps (e.g., [00:06](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=6), [03:01](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=181)) guide the reader through the main points. ## 📖 Main Content: - **Overview and Popularity:** - At [00:06](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=6), the video opens with an overview of block themes and highlights that Core 2024 leads with over one million installs. - Themes like 2023 and 2025, along with third-party options like Extendable and YesWonder, are discussed for their unique features and strong user adoption. - **Adaptability and Hosting Partnerships:** - At [03:01](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=181), McCan explains how block themes gain traction through bundling with hosting services and adaptability. - Notable hosting partnerships boost installation numbers, as seen with themes from Extendable and Yeth Wonder. - **Community Involvement and Design Flexibility:** - At [06:06](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=366), the discussion shifts to community engagement and the importance of the theme.json file, which controls settings such as color palettes and typography. - **Layout and Typography Settings:** - Detailed discussion at [09:18](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=558) covers fluid spacing, available units, and responsive typography settings that enhance content layout. - **Shared Structure and Functionality:** - At [12:52](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=772), block themes are shown to share a core structure despite visual differences. The theme.json file unifies settings for styling and templates. - **Patterns, Tutorials, and Community Support:** - From [16:25](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=985), McCan emphasizes the benefits of having extensive pattern libraries, tutorials, and Figma assets that aid users in theme customization. - **User Interface Challenges:** - At [24:56](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=1496), challenges such as the complexity of the site editor and misaligned default styles are discussed, highlighting areas for future improvement. ### 🗒️ Notes: - **Introduction & Overview:** - [00:06](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=6): Introduction to block themes and the significance of the Core themes. - [00:56](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=56): Brief mention of design evolution in WordPress. - **Popularity and Install Metrics:** - [01:18](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=78): Core 2024 theme with over a million installs. - [01:40](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=100): Discussion on the 2023 and 2025 themes with hundreds of thousands of installs. - **Third-Party and Hosting Bundles:** - [02:14](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=134): Introduction of Extendable and YesWonder themes and their association with hosting providers. - **Technical Structure:** - [09:18](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=558): Detailed look at layout and typography settings enabled via theme.json. - [12:52](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=772): Explanation of shared functionalities across block themes. - **User Experience Challenges:** - [24:56](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=1496): Identification of UI challenges in advanced layout customization. - **Future Tools and Trends:** - [16:25](https://www.youtube.com/watch?v=WtZ3yZ7HPvE&t=985): Mention of emerging projects like Greenshift that aim to improve block theme usability. ## 📖 References: - [Current State of Block Themes Transcript](https://www.youtube.com/watch?v=WtZ3yZ7HPvE) - Additional insights on block theme design from the WordPress.org documentation. ## 🗣️ Paraphrase: - **Paragraph 1:** Original: “Block themes are a new way to design WordPress sites, leveraging a modular approach that is defined by the theme.json file…” Paraphrase: “WordPress block themes revolutionize site design by utilizing a modular structure centered on a theme.json file, which standardizes elements like colors and typography.” - **Paragraph 2:** Original: “While the customization possibilities of block themes are extensive, the current user interface still poses challenges for achieving advanced designs.” Paraphrase: “Even though block themes offer wide-ranging customization options, their existing UI can impede the creation of sophisticated layouts.” ## 📰 Newsletter: Stay updated with the latest trends in web development! In our upcoming issue, we delve into the evolution of WordPress block themes. Discover how Core themes are dominating installations, learn about third-party themes bundled with hosting services, and explore the challenges and future improvements in block theme design. Get expert tips on customization using theme.json, and find out how community support and new tools like Greenshift are transforming user experiences. For a deeper dive, check out the full transcript and related resources [here](https://www.youtube.com/watch?v=WtZ3yZ7HPvE). ## ✅ Action Items: - **Educational Content:** - Develop a series of tutorials explaining how theme.json controls design elements in block themes. - Create webinars or live Q&A sessions focusing on troubleshooting UI challenges in block themes. - **Community Engagement:** - Organize workshops that allow developers to share best practices and experiences with block themes. - Encourage discussion on forums and social media to gather feedback on usability issues. - **Professional Alignment:** - Frame the article's insights to support open-source advocacy and education in WordPress. - Highlight how advancements in block themes can enhance transparency and inclusivity, aligning with your goal of becoming an OSPO director. - **Content Curation:** - Curate resources and case studies from successful block theme projects to build a comprehensive knowledge base for contributors. ## 🧪 Hypotheses: - **H1:** Block themes with extensive pattern libraries and flexible theme.json configurations will lead to higher user satisfaction. - **H2:** Streamlining the user interface for block themes will increase adoption among non-developer users. - **H3:** Integrating AI-driven customization tools can further enhance the efficiency of block theme development. ### 📊 Methodology: - **Data Sources:** - Analyze installation metrics and user reviews from WordPress.o - Document Tags: [[full site editing]] [[WordPress]] - Summary: In this video we take a deep dive into the current state of WordPress block themes. We look at the most popular ones, we look under the hood to understand block themes, and we look at the current stats. I have a better understanding of block themes after going through this process. Stats and summary are available on the WebTNG website: https://www.webtng.com/the-current-state-of-block-themes-and-a-reassessment/ 00:00 Introduction 01:15 A Look at the Most Popular 07:04 Ollie Theme Deep Dive 07:54 Anatomy of theme.json 14:33 Block Themes on Disk 15:54 What is Ollie Pro 16:58 Pattern Portability 18:59 Editing Settings in the Site Editor 20:23 Looking at Stats 21:50 Discussion and Conclusions - URL: https://www.youtube.com/watch?v=WtZ3yZ7HPvE Hi, this is David McCann for Web TNG. Inthis video, I'm looking at the currentstate of block themes. I've been churningon block themes in my mind for a coupleof months now, looking at a lot ofdifferent block themes, looking under thehood, trying to understand how blockthemes are made and also understandingwhat makes a block theme unique. Throughthat process, I've come to have a greaterappreciation for block themes, and myunderstanding of block themes hasshifted. Now, what I want to do in thisvideo is look at the block themes thatare most popular with the most activeinstalls, look at some stats, look under the hood at some block themes, and pointout the components of a block theme andwhat makes a block theme unique. Bythe end of the video, I hope that you'llhave a better understanding of blockthemes. Now, maybe you aren’t going towatch this video and suddenly switch to using ablock theme, but maybe you'll have aglimmer or an idea of how block themesmight fit into your workflow in thefuture. All right, so let's get started.The number one most popular block themeis the Core 20124 theme, which has moreMore than a million active installs. We've probably all seen this theme whenwe installedWordPress. If we go to the next one, it isthe 2023 theme, another core theme withmore than 500,000 activeinstalls. The 2025 theme, which is alittle bit different in that it's moreminimalist, has more than 400,000 activeinstalls. Finally, the 2022 themehas more than 300,000 activeinstalls. Okay, so those are the corethemes with the most activeinstalls. Now, let's start looking at somethird-party themes. Some contributedthemes. Extendable is the number one third-party theme in terms of activeinstalls. It has more than 100,000 activeinstalls, and the number two is YesWonder, with more than 70,000 activeinstalls. Yes Wonder is a theme thatfocuses more on WooCommerce. If we dropdown to the next level, we come to the nefull-site editing theme, which has morethan 10,000 activeinstalls. So there's a big jump betweennumber one and two, and number three, andthe reason for that is notsurprising once you look into it. Go look at how extendable it is; this is a themecreated byExtendi. What Extendi does is theyprovide AI site generation tools tohosting providers. Okay, so if we look attheir pricing, for instance, you see theseare the pricing. What they do is they’reselling their AI tools for site creation andlaunching tools to hosting providers, andthey use the extendable theme. Okay, if wego to YTH Wonder, we find that that’sassociated with Bluehost, anotherhosting provider. So these themes aregetting installed with hosting, and sothat’s one of the reasons they have somany active installs. So let’s go back, though, now, andhere is Neeve, which is created by the themeIsle. Theme Isle is a theme shop that’sbeen in business for a long time, andthey’ve been successful because theycontinue to adapt to thetrends. So, Neeve has morethan 10,000 activeinstalls. We keep going, Raft is also fromTheme Isle, with more than 10,000 activeinstalls.Then Variations is a theme created byTyler Moore. It has more than 10,000active installs. Attention on YouTube, he's someone everyyear who creates a video on how tocreate a website using WordPress. Thevideos are maybe 2 hours long orsomewhere around that duration. He goes through all the stepsfrom the beginning to the end. In hislatest version of his video, he's showingpeople how to build websites with blockthemes using his variations of block themes.If we keep going, this is Zver, which youcan see is a very attractive theme, downto 9,000 plus activeinstalls. Then Spectra, one which is fromBrainstorm, who makes the Astra theme,which probably has more than two millionactive installs. Okay, that’s got 8,000 plusactive installs. It’s another creator ofa classic theme that’s experimentingwith blockthemes. If we keep going, this is Jadrofrom Code inWP. That is the WP Shout team. Okay, sothey're promoting their block theme inthat manner. We have Bor, which is byEnders Norin, who’s a very creative themeauthor. You notice this is marked asa community theme. There’s no kind ofupsell forthis. Riverbank has 4,000 plus active installs.Another theme, Aisle, has 3,000 plus active installs.Another theme, Aisle,theme, Jackson, has 3,000 plus active installs.You notice something going on here; they have a lotof themes in, you know, like the top 20.Here, let's keep going: Green Shift hasmore than 3,000 active installs.WP Soul makes the popular Green Shift plugin suite. This is a very flexible theme, which when you integrateit with just their free companion Green Shift plugin,provides a lot of advancedkind of features; kind of cutting edge in some ways.Oi Mike Malister has gotten a lot of attentionwith the creation of the Ali theme; heputs a lot of care into this theme.You notice it says commercial theme,there is a pro version; we'll go look atthat in a little while. We're going touse the Oi theme as one of our guineapigs here. Let's take a look at a websitethat has the Ali theme installed. This isour default homepage. This layout looks alot like what you get as a defaultlayout with Astra, Cadence, or theBloxy theme. You know, it doesn't look thatDifferent from those classic themes, veryclean andattractive. What I want to do here isI want to look at the theme JSONfile. All block themes have a theme JSONfile. The theme JSON file is kind of like thebackbone of a block theme. If we go downand look here at what the differentsections of the block theme settings are,we have some color duo-tone gradient palette. Okay, it's saying that they custom ones.The defaults are false. Here are duo-tonesettings. Here are gradientsettings. Here's a color palette. You noticethat they're giving it a name, butthey're using a slug here, and theseslugs are, I think, turned into CSSvariables. You know, we have main accent,base, so you know here's our colorpalette. We keep going down. We have fontweight settings, and these are the nameswhich will be turned into CSS variables,and the weights for them, the line heightnames, andsettings. We have layout for the contentwidth. We have box shadowsettings. We have spacingsettings, and here they are using clamps.So we have fluidspacing. Theunits and block gaps. Here'sthe topography settings we've defined: thefont families, different variations ofthe Mona Sans font family forAlis. So we keep goingdown and here we have fontsizes, and you notice that there are Minand Max. I think these Min and Maxsettings are used for fluidtopography. If we keep goingdown, we now go to a place where we havestyles for the blocks, for the coreblocks. So here's the style for the codeblock, the core code block for thecomments author name, comments content,comments date, comments edit link, replylink, comments title for the commentsform, for the post excerpt block, for theread more element, for navigation, for the paragraph block, forpost terms, for posttitle. Okay, for pullquote, for querypagination. All right, we're getting nearthe end forquotes, for search, for separator, for sitetagline, for sitetitle. Okay, and then for buttonsand for ourHeadings and somespacing,topography. Then we have some customtemplates defined,and we have template parts defined: header, footer,sidebar. Okay, so this is the Ali theme,which is one of the most talked aboutthird-party themes. Let's go now and look at the theme JSONfile for the 2025 theme. Here we have ourcolor palette defined, so things are in adifferent order. Here,but we are seeing the same types ofsettings. Here's the layout, the contentwidth, thespacing options. We have clamp settings there; wehave theunits. We have our topography settingswith the min and max which will be usedin the fluid topography. And rememberthat the site editor has a font managernow, so you can set up your fonts to beservedlocally. And let's keep going down; wehave the font families.[Music]Defined our block gap, our topography. The Avatarblock button,block code,block,comments, comments, content, comments date. Comments edit link, reply link, comments form.[Music]Pagination, post navigation link, post,terms, post title,quote all the core blocks you see in thetheme.json. You can define the default style for coreblocks.Quote, search, separator, tagline, site title, term,description. Navigation and then we have caption and the heading.Things, sizes, okay, template parts and custom templates. So you see, even though things are in different order, the Ali themejson and the 2025 theme JSON have a lotof similarities. They’re using the sameframework. What it is, I guess, is a block theme,and that’s what is definedin the theme.json file. Okay, now if we go onto theThis, and we look at the AL theme, we cansee that it has assets, fonts, andstyles. These are the font files and theCSSfiles. It has template parts: header,footer, sidebar,patterns which are saved in PHP files. But I think you'll find that all of thepatterns that ship with themes fromwordpress.org use only coreblocks. These are some theme JSON filesfor different colorpalettes. Here we have the templates, whichare HTML files, which are pretty easy tomake. Then the functions.php,index.php, license, read me, andscreenshot the style.css, and the themeJSON that we just looked at. Other blockthemes are going to be similar. They'llhave some things different, but here areassets, here are parts, here are patterns,here are styles, and here are templates.So, very similar structure to the blockthemes. Okay, let's go now and visit theAliwebsite. Okay, and let's go check outPro.And here are the features; this is whatyou get with Ali Pro. You get access tothe pattern library. It's a cloud library. For accessing patterns, more than 200patterns are available, including more than 30 full page designs.You get the theme, which is free, and you also getsupport. There’s a setup wizard,there’s a plugin you install that givesyou access to the Cloud Library. Thereare video tutorials and an option tofavorite some of the patterns that youlike the most, Figma assets, and a Slackcommunity. Then they’re working ontheir own block collection. Okay, but themain thing you’re getting is access to the patterns and tosupport. All right, now let’s go and look onwordpress.org. If you go to extendpatterns, there’s a pattern library here.Okay, 239 patterns. So we can look atthe patterns here; these are all createdusing coreblocks. Let’s click on this one, let’sturn on a hover file inspector and seewhat we have here. We have the system UIfont,so it’s using systemUI. So let’s copy thispattern. Let’s go back to ourwebsite, let’s go to apage and add new. We’ll call it testing,and I’m just going to save it all. Right now, I'm goingto pastein what we copied, the pattern that wecopied, and here itis. I'm going to go, and you'll note thatwe're using the pages template of theAli theme. But I noticed when we lookedin the themeJSON that there is a full-width, no title.So let's choose that one andsave. Now let's go view it, and if wego and inspect withHover, we see now it's using the MonaSansfonts. We have used a pattern notassociated with Oi; we brought it in, andit was adapted and convertedautomatically for use.Now let's go, and let'sedit the theme in the site editor. Let'sgo toStyles. Here are our color palettes thatwere defined. Let's go edit, and youwill notice over here we can edit and changethetypography, the color, the background, theshadows, and the layout. The settings thatare in the theme.json file can beoverridden or changed,customized, and you can then. Create block themes plug-in installed,and so we can change settings to thetheme. We can create our own theme bycloning the theme, creating a child theme,and when we do that, we bring into ournew theme JSON the settings that weoverridden or changed when we wereediting the styles. So the create blocktheme plugin isn’t perfect for creatinga theme, but for many uses it’s goodenough. And because block themes havethat common backbone, the theme JSON,there’s a lot of portability here. So now,let’s look at somestats. I went through a large number ofpages of block themes. There’s a plusafter each of these numbers, but you seethere are 2.2 million active installs withcore themes, and then these are the third-partythemes. We looked at some of thesein November. I looked at the stats then; Iwas going to make this video back inNovember but didn’t get a chance. Butthat gives us a comparison of a coupleof months, and the ones that went up increased. You know, went up a step, and down wentdown a step, so there is some fluidityhere. But here are the ones that you knowwe looked at; we kind of got down toabout. 3,000. Okay, then we get down to2,000. You notice here, here's Frost, then wekeep going, and we're down to1,000. Okay,and there are four or five that droppedfrom 1,000 down to 900 or800. So I didn’t note the themes thatwere less than 1,000 activeinstalls. All right, so we've looked atsome block themes. We looked under thehood, we’ve looked at some stats. Now forsome discussion andconclusions. We took a look at a numberof the most popular block themes, theones with the most active installs. Weflipped through those. We saw thatvisually, there was a lot of differencebetween the themes, but when we lookedunder the hood, we saw that there were alot ofsimilarities, and one of the things thatall block themes have is the theme.json file. In there, it definesstyling for core blocks. The themestyling for core blocks defines sometemplate parts and templates, but it alsohas the colors, the fluid typography, thefluid spacing, background shadows, andlayout settings. That group ofsettings, when you think about it, I guess,We could call that the block themeframework. So if we consider stats overall,as of January 17,2025, when I compiled the stats, therewere 1,180 block themes, including fourthemes with2,755 total active installs. Without core themes, there were54,600 active installs with an estimated1,176 themes, and 89 themes had athousand or more active installs. Now, whenwe think of active installs and themes,if this was classic themes and we wantedto know what the most popular themeswere, we’d throw out the core themes andwe’d throw out the ones under a certainthreshold. But I’m going to suggest thatthat’s not appropriate for blockthemes, and the reason why is because, inmany ways, a core block theme is just asappropriate a starting point as athird-party block theme if you’rebuilding a site using the site editor.Yes, that’s one of the main benefits: youhave access to the site editor.And as we saw, all of the block themesare using the same block theme framework,so it’s not like certain blockthemes have features that others don’t. What they have is they have differentStyles, in some fundamental way, they're alot more on the same level thandifferent classic themes. So, for me,that brings about a little bit of are-evaluation of blockthemes. While block themes exhibit anelegant simplicity, the fly in theointment is the user interface for thesite editor. Even experienced users haveto fight against the default coursestyles when trying to implement advancedlayouts anddesigns. Issues like styles being appliedto wrappers, ghost spacing, alignmentissues, inconsistent block controls andlack of responsive editing options makeit difficult to achieve advanced pixelperfect layouts. This is made worseby claims that the block editor and sideeditor is a page builder, resulting inmisalignedexpectations. Now developers can workwith block themes in a code editor toachieve goodresults. But for the end user, the userinterface isn’t there yet. While thepotential of block themes in the siteeditor hasn’t yet been realized,projects such as Greenshift are tryingto make that happen. By setting core styles and exposingCSS variables and classes within theeditor, my exploration of block themeswhich I've shared with you in this video,has helped me to better understand themand their potential. But now, what do youthink? Did I miss something important orget it wrong? Please share your insightsin the comments below or join theconversation in the dynamic WordPressFacebook group. I hope you've learnedsomething by watching this video andfound it interesting. If so, please giveit a like and subscribe to the channel.Thank you for watching., Current State of Block Themes, David McCan, 01jjyrn3v3a5kjy42b0dyx4py9.