The Greyd Plugin extends the functionality of native WordPress core blocks with a variety of features that seamlessly integrate into the Block Editor. These enhancements are active automatically when the Greyd Plugin is installed and do not require separate activation.
Features
Unlike individual features, “Core Block Extensions” are a collective set of improvements made directly to standard blocks. The extensions vary depending on the block and generally fall into four categories: custom features, new block styles, the dynamic greydStyles system, and advanced supports.
Custom Features
Some core blocks are enriched with Greyd-specific functionality using custom block attributes. These attributes often come with specialized editor controls and modify the rendered output of the block in the frontend. Details about specific implementations can be found in the documentation for each affected block.
Block Styles
The Greyd Plugin makes use of the native “Block Styles” feature in WordPress to offer additional visual variants for certain core blocks. These styles work by assigning a unique className to the block wrapper, allowing for alternative styling when selected. The new block styles are available in the block’s sidebar settings and apply immediately upon selection.
greydStyles System
One of the most powerful extensions the Greyd Plugin provides is the greydStyles system, which enables responsive styling as well as hover and active states for many core (and custom) blocks. This is made possible via an additional attribute called greydClass.
This custom class is auto-generated and stored with the block. You can reset it manually if needed using the Generate new class button found in the Advanced panel of the block settings. Resetting the class may be helpful if you notice style inconsistencies between a block and its dynamic template.
When a block supports greydStyles, you’ll find enhanced styling controls marked with icons for responsive, hover, or active states.
Clicking the responsive icon reveals four tabs labeled Desktop, Tablet, Tablet Small, and Mobile.
Clicking the hover icon shows two tabs: Normal and Hover. In some blocks, an Active tab may also be available.
Once a tab is selected, the respective value for that state can be configured. When switching responsive tabs, the editor’s preview also updates to reflect the selected breakpoint, syncing all other responsive controls accordingly. When editing a Hover or Active tab, a preview class is added to the element in the editor to simulate the interactive state.
For more specific information about how greydStyles are used in each block, refer to the documentation of the respective core block below or custom block in their own articles.
Advanced
Beyond block-specific features, the Greyd Plugin adds several global capabilities to core blocks using custom supports. These enhancements appear in the “Advanced” panel of the block settings and are available for a wide range of blocks — including many custom ones. See the Advanced section article for more details