PHPackages                             bmd/block-preset-classes - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. bmd/block-preset-classes

ActiveLibrary[Utility & Helpers](/categories/utility)

bmd/block-preset-classes
========================

Extension to add preset classes to wordpress blocks.

0.3.7(1mo ago)0107GPL-2.0-or-laterJavaScriptCI passing

Since Apr 22Pushed 1mo agoCompare

[ Source](https://github.com/bob-moore/Block-Preset-Classes)[ Packagist](https://packagist.org/packages/bmd/block-preset-classes)[ Docs](https://github.com/bob-moore/Block-Preset-Classes)[ RSS](/packages/bmd-block-preset-classes/feed)WikiDiscussions main Synced 1w ago

READMEChangelog (10)Dependencies (9)Versions (12)Used By (0)

Block Preset Classes
====================

[](#block-preset-classes)

[![Block Preset Classes](assets/banner-1544x500.jpg)](assets/banner-1544x500.jpg)

[![WordPress](https://camo.githubusercontent.com/975973c5e9a2b897cc1922bcc8fcbd497cebc5ec5a057ecfa204eacf7ff59bc0/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f576f726450726573732d362e372532422d3338353865393f6c6f676f3d776f72647072657373266c6f676f436f6c6f723d666666)](https://wordpress.org/)[![PHP](https://camo.githubusercontent.com/8da406bc1dd3dcb38541095055eef712a822936eee12a6c185a71f6e678091b2/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f5048502d382e322532422d3737376262343f6c6f676f3d706870266c6f676f436f6c6f723d666666)](https://www.php.net/)[![Latest Release](https://camo.githubusercontent.com/5c52e28da63e0363025e5f80051e0ff9adfb1cd863bf7d6160e781ecb93036b1/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f762f72656c656173652f626f622d6d6f6f72652f426c6f636b2d5072657365742d436c61737365733f6c6162656c3d72656c65617365)](https://github.com/bob-moore/Block-Preset-Classes/releases/latest)[![License](https://camo.githubusercontent.com/cd781d0568c328bdea35f284d33e2b1e96675ef60910926c1dd75d5a4d46de66/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d47504c2d2d322e302d2d6f722d2d6c617465722d626c7565)](https://www.gnu.org/licenses/gpl-2.0.html)

[![Lint CSS](https://github.com/bob-moore/Block-Preset-Classes/actions/workflows/lint-css.yml/badge.svg)](https://github.com/bob-moore/Block-Preset-Classes/actions/workflows/lint-css.yml)[![Lint JS](https://github.com/bob-moore/Block-Preset-Classes/actions/workflows/lint-js.yml/badge.svg)](https://github.com/bob-moore/Block-Preset-Classes/actions/workflows/lint-js.yml)[![Lint PHP](https://github.com/bob-moore/Block-Preset-Classes/actions/workflows/lint-php.yml/badge.svg)](https://github.com/bob-moore/Block-Preset-Classes/actions/workflows/lint-php.yml)

Want to give it a test drive? Try it in the WP Playground: [![Try it in the WordPress Playground](https://camo.githubusercontent.com/a0529297e249b57294f46f9380919691964b02a0e9d5915752d6691f962afd85/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f57505f506c617967726f756e642d76302e332e362d626c75653f6c6f676f3d776f72647072657373266c6f676f436f6c6f723d253233666666266c6162656c436f6c6f723d25323333383538653926636f6c6f723d253233333835386539)](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/bob-moore/Block-Preset-Classes/main/_playground/blueprint-github.json)

Block styles are useful… until you need more than one.

By default, WordPress only lets you apply a single block style at a time. That means if you want combinations (padding + border + background), you end up creating a bunch of nearly identical styles just to cover every variation.

This plugin solves that.

Block Preset Classes lets you define reusable presets (CSS classes) and apply multiple of them to a block.

Instead of picking one style, you can stack presets and mix them however you want.

Under the hood, it simply adds those classes to the block’s Additional CSS Classes field — the same way block styles work, just without the one-style limit.

Add reusable preset classes to WordPress blocks and let editors stack multiple presets on the same block.

Features
--------

[](#features)

- Lets editors apply multiple class presets to the same block instead of being limited to one block style.
- Supports global and block-specific preset definitions.
- Loads preset options from one REST request per editor session, then filters in JavaScript from cache.
- Supports runtime option mutation in JS via `bmd.blockPresets.classOptions`.
- Ships with a scoped GitHub updater for release-based plugin updates.
- Works as both a standalone plugin and a Composer-installed dependency.

Requirements
------------

[](#requirements)

- WordPress 6.7+
- PHP 8.2+

Installation
------------

[](#installation)

### Install as a plugin

[](#install-as-a-plugin)

1. Download the [latest release ZIP](https://github.com/bob-moore/Block-Preset-Classes/releases/latest/download/block-preset-classes.zip).
2. In WordPress admin, go to Plugins > Add New Plugin > Upload Plugin.
3. Upload the ZIP and activate Block Preset Classes.

### Install via Composer (library usage)

[](#install-via-composer-library-usage)

If you are embedding this into your own project:

```
composer require bmd/block-preset-classes
```

If your project is not already using PHP-DI, bootstrap the plugin with `Main`:

```
use Bmd\BlockPresetClasses\Main;

$dependency_url  = plugin_dir_url( __FILE__ ) . 'vendor/bmd/block-preset-classes/';
$dependency_path = plugin_dir_path( __FILE__ ) . 'vendor/bmd/block-preset-classes/';

$plugin = new Main(
	[
		'package' => 'block_preset_classes',
		'path'    => $dependency_path,
		'url'     => $dependency_url,
	]
);

$plugin->mount();
```

The `path` and `url` config values should point to the Block Preset Classes dependency root, not the file where you call it. For example, pass `/path/to/vendor/bmd/block-preset-classes/` and the matching public URL for that directory.

### Using an Existing PHP-DI Container

[](#using-an-existing-php-di-container)

If your parent plugin already uses PHP-DI, you can skip `Main` and load Block Preset Classes into the parent container. This keeps one application container and lets the parent controller initialize this package's controller alongside its own services.

Add the package definitions to your parent definitions file and override the package-relative path and URL resolvers:

```