Extended Block Variations
Add support for per-block-variation CSS files, conditionally enqueued when the style is used and compatible with WP's CSS inlining support.
by Human Made · github.com/humanmade/extended-block-variations
★ 1stars
3.6kcomposer installs
0forks
Install
No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:
wp plugin install https://github.com/humanmade/extended-block-variations/archive/refs/heads/main.zipAlso on Packagist as humanmade/extended-block-variations:
composer require humanmade/extended-block-variationsFrom the readme
Extended Block Variations
Extends WordPress theme.json block style variations with custom properties for external stylesheets.
Overview
WordPress supports defining block style variations in theme.json partials located in the /styles/ directory. However, the native implementation doesn't support linking external CSS files to style variations, either by stylehandle or by file: reference.
This plugin adds support for this feature through a custom property in your theme.json variation files.
Usage
Custom Property
Add this custom property to your block style variation JSON files in themes/your-theme/styles/.../.json:
stylesheet (string)
Path to an external stylesheet or a registered style handle.
- File references: Use "file:./path/to/file.css" to reference a CSS file relative to the JSON file's location
- Style handles: Use a string matching a registered WordPress style handle
Example
File: themes/your-theme/styles/blocks/button/primary.json
File: themes/your-theme/styles/blocks/button/primary-button.css
File Path Resolution
File paths are resolved relative to the JSON file's directory:
- JSON at: themes/your-theme/styles/blocks/button/primary.json
- Reference: "stylesh
Read the full README on GitHub →