0

I using the InnerBlocks tag to allow for nested blocks, within my custom block. I am trying to use the 'allowedBlocks' argument to restrict the blocks allowed to only specific ones. However, if I put anything inside the InnerBlocks tag, the block does not load and just spins.

I am using acf_register_block for my block registry, as what we are doing heavily ties in with ACF. I have enabled '__experimental_jsx' => true in all the blocks I am working with.

This works

<div>
    <InnerBlocks />
</div>

This does not work

<div>
    <InnerBlocks allowedBlocks={ 'acf/orange-carousel' } />
</div>

It also doesn't work if I pass an array instead of a string for the allowed blocks.

I am using ACF Pro Beta 5.9

Any help is appreciated!

1

A late reply but I thought I would include a snippet that worked for me.

Update $allowed_inner_blocks with your own "block_types" and place the following code inside the parent block template;

<?php $allowed_inner_blocks = ['acf/logos']; ?>
<InnerBlocks allowedBlocks="<?php echo esc_attr(wp_json_encode($allowed_inner_blocks)); ?>" />
0

Is acf the correct namespace? if so, this should work in your edit function.

const ALLOWED_BLOCKS = [
    'acf/orange-carousel',
]

return (
    <div className={className}>
        <InnerBlocks
            allowedBlocks={ ALLOWED_BLOCKS }
        />
    </div>
);
3
  • Yea it should be, that's what the block is registered as. Also, can you clarify what you mean by "edit function"? Keep in mind I am using ACF to register these blocks. acf_register_block
    – Leathel
    Jun 1 '20 at 19:06
  • Sorry i missed that. My thought process on this was to use @wordpress/create-block and write a new block, then call your acf block using InnerBlocks there.
    – Garrett
    Jun 2 '20 at 20:08
  • Interesting, Il give it a try
    – Leathel
    Jun 2 '20 at 20:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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