Resources

On this page, I will include a list of resources about how to create custom block styles and patterns for WordPress blocks.

If you have tips about resources, please email me to add them to the list: hi@wpblockstyles.com

Note that with time, as the development of the block editor continues, some of these code examples and instructions may be outdated.

Articles

Creating a simple block pattern plugin for the Gutenberg editor
By Mel Choyce
https://developer.wordpress.org/block-editor/developers/filters/block-filters/
The official documentation for block filters

Theme shaper: Customizing Gutenberg blocks with block styles Kjell Reigstad on February 15, 2019.

Block Styles in Gutenberg
Great article by Bill Erickson

Code.tutsplus.com: Create Style Variations for WordPress Gutenberg Blocks: Part 1 and Create Style Variations for WordPress Gutenberg Blocks: Part 2

How to Build a Gutenberg Block with Custom Styles
By Alex Mansfield
https://jeffreycarandang.com/how-to-add-custom-gutenberg-block-styles/
By Jeffrey Carandang

Code

https://github.com/Automattic/gutenberg-block-styles