Support

Account

Home Forums Gutenberg ACF Blocks issue when made "reusable"

Solving

ACF Blocks issue when made "reusable"

  • I have created a ACF block called “services” that contains a repeater field and a few other sub fields to display my customer’s services.

    When I choose to “add to reusable blocks” I get a little bit of a strange behavior.
    Reusable blocks add a wrapper around the original block. So your original block is nested inside of this new container

    My original block is visible with the content that I originally added. However when I deselect my block and attempt to save the reusable block, I see that the reusable block has a second version of my repeater fields, empty and ready to fill in.

    In case that is unclear, I’ll describe it in this way: two versions of the ACF field group are being added. One at the level of reusable block, and one at the level of the custom block.

    To replicate:

    • Create a custom block (set the mode as “preview” so the editing takes place in the sidebar) and add content to your new block.
    • “add to reusable blocks”
    • save and refresh your page
    • click on the reusable block and select “edit”
    • click on your reusable block and make an edit
    • deselect your reusable block and click on the save button at the reusable block level
    • It won’t save, instead look in the sidebar and you will see another set of empty fields
    • click on save againโ€ฆ and this time it should actually save.
  • I came back to this to try a few other ideas.

    This time if the block mode was set as “preview”, even when I clicked the editing pencil icon, I could not edit any of the fields as they were grayed out. Changing the embed mode back to “auto” allows editing of the fields, but weird behavior in the UI where you have to click two or three times to get the save button on the re-usable block to work.

  • I encountered this issue as well, and the comments above pointed me in the right direction.

    I had registered my blocks using the acf_register_block() function, outlined in the documentation. I didn’t specify the mode, but that turned out to be the key to get this working. Setting the ‘mode’ to ‘edit’ was the first step, and ‘auto’ may have the same results. I also needed to convert the reusable block to a regular block, save the post, and reload the editor.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.