Before we dive into blocks and see how everything is set, we should describe this setup's mindset.
If you've managed to set up your project by this point with the WP-CLI command
setup_theme, you might have a few questions. We will try to answer all those questions here.
Why do all my blocks look the same and have the same name structure?
This is so because we defined the name structure for all our blocks and components to load everything automatically. For more information, please check the block structure and component structure chapters.
What is the difference between components and blocks?
The main difference is that blocks are available in the block editor's block picker, and components are not. With that being said, blocks are registered using the
registerBlockType method, and components are just here for you to bundle some functionality in one place and reuse it wherever you need.
Do I need to have Storybook stories in my block?
No, you don't. But we provided you with the ability to use the Storybook for all of your blocks and components. Why not use it? It will speed up your development time. Trust us. 🙂
For more details on how to write stories, check out this chapter.
Do you support block variations, and how can I use them?
Yes, we do. All block variations are located in the
src/Blocks/variations folder. For more information about this, please check the variations chapter.
Do you support patterns, and how can I use them?
Yes, we do. For more information, please read the patterns chapter.
What is a wrapper?
Read about wrappers in this chapter.
Do you support inner blocks?
Yes, we support everything that the core natively supports. You can find more information on how to use them in this chapter.
Why do you use manifest.json in all blocks and components?
So that we can provide content, attributes, options, and much more across multiple different files in multiple contexts (in both PHP and JS). You can read all about it in this chapter.
Why do you use global manifest.json?
The answer is the same as the previous one. In the global
manifest.json, we have options that are shared across all blocks and components. Read more about it in this chapter.
If I want to create a new block/component, what do I do?
In your terminal, write
wp boilerplate use_block --name=example
and style that block however you seem fit.
What if I add a block and it throws an error that it is missing some components, what do I do?
All blocks/components have some kind of documentation and in that documentation we have a list of dependencies each block/component needs to have in the project in order for it to work. For example you can look in the heading block, as you can see the heading blocks depends on the heading component, so if you install a heading block before heading component it will resolve in to an error. So please be sure that your block/component installation follows the correct order.
How can I use your pre-made blocks?
You can check all available blocks/components using these two commands
wp boilerplate use_block --help
wp boilerplate use_component --help