WP Manifestindependent plugin directory
manifest / editor / wp-block-custom-variation-and-pattern

wp-block-custom-variatioon-and-pattern

Custom Gutenberg Block Variation and Pattern Using Minimal Setup.

★ 0stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/mainuldip/wp-block-custom-variation-and-pattern/archive/refs/heads/master.zip
No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.

Overview


This is a bare minimum plugin to create custom block variation and pattern in wordpress block editor.
Note: Block Variation Use Mostly Client Side Integration Where pattern use server side.
Choose as your preference :)

Instructions


First Install The Packages

npm install

Then Start The Node Server In Watch Mode By Running

npm run start

After finishing development run

npm run build

Folder Structure


Edit the src/index.js file to customize the variation Edit the index.php file to put block pattern

Notes (inline css injection):


As of writing this, maybe to work perfectly with headless architecture, wordpress gives no way (or not documented yet) to push custom inline styles through block variation api. You can use custom css classes to get fine grain control.

Notes (Hooking Block Variation Assets):


Shortet way is through init hook and register_block_type_from_metadata using block.json structure (see index.php for detail). And also alternatively you enqueue scripts and asstes on editor-only or both side.

Happy Coding :)