Pseudo states In WordPress 7.1, users have more power over styling the pseudo states of blocks. Currently limited to the Button and Navigation Link blocks, users are able to apply styles to 'hover', 'focus', 'focus-visible' and 'active' states. Pseudo states support definitions in theme.json for themers, and block styling in global styles and on block…

WordPressCore's platform is a central hub for WordPress developers and contributors, offering insights into WordPress core development, plugin development, and theme customization. Through articles, tutorials, and community forums, WordPressCore offers insights into WordPress architecture, development best practices, and contributing to the WordPress open-source project. Readers can learn about WordPress coding standards, security guidelines, and performance optimization techniques to build powerful and secure websites with WordPress.

Make WordPress Core

WordPress 7.1 introduces pseudo state styling (hover, focus, focus-visible, active) for the Button and Navigation Link blocks, configurable via theme.json, Global Styles, and block instance attributes. A new custom states system allows theming of special block states like the current menu item in navigation links, using a dash-prefixed convention in theme.json. Site owners can disable user-facing state editing via the blockStatesEditingEnabled editor setting, while existing saved styles remain unaffected.

Pseudo and custom style states in WordPress 7.1