Allow the use of the block type
If you use Layout Builder Restrictions, make sure you allow your block type to be used. You do this on the content type manage display tab, in the layout options sections, block available for placement (all layouts & regions).
- Custom block types: Allow specific Custom block types blocks: Checkbox
- Custom blocks: Allow all existing & new Custom blocks blocks: This allows all new instances of the custom block types that are allowed in above setting.
- Inline blocks: : Allow specific Custom block types blocks: Checkbox
Adjust for your particular project, but the above settings are a good mix of restricting but also allows for content creator to add new instances when needed. Below is an example of the UI, and after testing I would include more of the custom block types as I found I couldn't add custom blocks if the custom type wasn't allowed. This may take a bit of setting up, but well worth it.
Once we have set up the restrictions correctly to allow the use of the custom block types, we can now use them in Layout Builder. As stated, we will have two ways to use custom block types. The two ways are directly related to whether you want the block to be available to many layouts or only one layout, that is either global or inline. Let's have a look.
How to Create a Global Custom Block Type Instance
- Visit Content > Blocks
/admin/content/block - Click Add content block
- Choose your block type
- Populate
- I like to add [Global Block] as part of the Block Description.
- Click Save
No need to "save and configure" when creating a global block for use with Layout Builder; this feature is for adding blocks to global regions using the block layout page.
Now the block will be available as a Content Block
- Go to any page that uses Layout Builder with the custom block type allowed.
- Click Add Block in the layout where you want to add the block.
- Select the Content block.
- Configure the block settings.
- These need to be set up using the Layout Builder Styles module
- Click Add Block.
How to Create an Inline Custom Block Type Instance
This will only be usable as the instance that is created on the page that is created.
Go to any page that uses Layout Builder. Click on the Layout tab.
- Click Add Block.
- Click Create Content block.
- Select the block to create.
- Fill in the data and any block settings that are included.
- Click Add block.
Edit your Block Instances
It is probably not necessary to say this, but to edit the information/data that the block instance holds, you need to edit it where it was created. That is for global block type instances in the custom block library and for the inline instance directly in layout builder UI.
Summary
That is it. You now have learnt how to use the Paragraphs Module's powerful structured content in custom block types.
We first looked at how to set up the block type but attaching your paragraph type. Next we looked at how to add templates for the component; you need to add a paragraph custom template at the least, but I also ran through how to add a block template, which can be useful to have more control over the layout of the block type.
Finally, we looked at allowing the use of the custom block as a global or inline instance and wrapped up with how they can be placed in the layout.
The process to set up a new component can take time, however once done, your users can use them as many times as they want. I hope this was a useful series for you. If you are interested in learning more about Drupal and front-end design and development, be sure to sign up for my newsletter below .
Simon