1

I've been trying to figure out if it's possible to restrict the innerblocks available in some of the core block. Right now I'm looking to restrict what can be used inside core/media-text and core/column. I have yet found a way to do this.

Before I plan on building out custom version of my own I thought I would ask and see if anyone knows of a way to do this that I haven't come across yet. I'd prefer to use the core block if possible.

7
  • You can filter Core blocks, but since allowed blocks are controlled inside the JS itself, you would basically have to take over each block's entire edit function. Since that is likely to be some pretty extensive code, it's probably preferable to create your own parent blocks and completely unregister the Core blocks.
    – WebElaine
    Mar 20, 2023 at 16:51
  • Thanks @WebElaine, that was sorta what I was expecting at this point. If I have to heavily modify the edit part of the block i'll just do it myself and not worry about future updates. It would be nice if core blocks made it easier to create an individual allowed list. Mar 20, 2023 at 17:21
  • you don't have to take over the blocks edit component, it's enough to filter the definition of the block on registration. Note that what you're asking for will cripple any block theme, as well as most block patterns in the inserter. @TidusInAtlantis it would be super helpful to know why you want to do this and what you plan to achieve by doing it, normally when people run into problems like this it's because they've misunderstood something or they're unaware of a feature/system that fixes the original problem by other means
    – Tom J Nowell
    Mar 20, 2023 at 17:43
  • @TomJNowell I'm just looking to determine whether or not I can restrict innerblocks on specific core blocks without having to rewrite the edit function. Take the media-text block as an example. Love the block, love the functionality, but have no interest in letting our user insert a 3 column block inside the text portion of the media text block. I think a column block inside a narrow area in the media text block is just bad design, I am trying to determine if I can do anything around restrictions before I make the decision for our team to just build versions of our own and have full control Mar 20, 2023 at 17:49
  • true but that's solvable with plain CSS, and as I said, you don't have to touch the edit component at all, blocks can declare what children they support and even what parent they support entirely in JSON/settings, not just the props of the innerblocks component. Note that the scenario you envisaged can be reproduced entirely using columns, and theme.json goes a long way towards remedying these kinds of problems by defining the various layout options. Overriding something as fundamental as columns is likely to have big consequences if you don't update it on every release
    – Tom J Nowell
    Mar 20, 2023 at 18:34

1 Answer 1

0

For anyone looking for something similar I came across this in a PR - https://github.com/WordPress/gutenberg/pull/31326#pullrequestreview-781388981

This filter setup has worked for any block that I've tried that has allowedBlocks set as an array in the block.json file.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.