WordPress Themes Directory Adds Style Variation Previews

WordPress.org theme previews just got a major improvement this week with the addition of Style Variation previews. The previews now appear on block themes that include style variations.

Themes that have more variations than what fits in the space beneath the preview pane will display all variations in a carousel with little arrows to navigate to the next ones. Here’s an example with the Pixl theme from Automattic that contains seven brightly colored variations:

It’s also possible to see a selected style variation loaded into the theme preview now. Clicking the ‘Preview’ button will allow users to scroll and explore the theme with their selected style variation applied.

“These style variations, designed by theme authors and packaged in block themes, help users have a diverse set of approaches to their site design allowing them to find one that aligns with their goals,” Automattic-sponsored Meta team contributor Steve Dufresne said. “This feature helps to highlight the flexibility of modern WordPress themes and it’s time to have it baked into the theme directory experience.”

The new style variation previews are fetched from the themes’ /styles/{variation_name}.json files, so theme authors do not have to do anything to make the previews work. They will automatically display for any theme that includes style variations.

Meta team contributors are also working on adding the ability to filter the directory for themes with style variations. Dufresne proposed creating a new style-variations theme tag as the simplest route towards implementing this.

“Doing so will allow the active filtering of these themes without needing to make many if any code changes,” he said in the ticket‘s description.

“A longer-term solution should look at exposing these features visibly somehow without needing to find the obscured filters that we currently have. This feature should be judged equally with others and therefore, this type of implementation should be better debated and falls out of the scope of this ticket and the immediate need to see themes with style variations.”

This is a good observation, as not all WordPress users hunting for themes will know that a tag exists in the Feature Filter. That list is already quite lengthy and not the best user experience for discovering themes with specific features, especially if users don’t understand what the terms mean. Theme authors will want to watch this ticket. If the shorter term solution of creating a new style-variations tag is committed, they will need to update their themes with the tag to be included in the filtering.