Dear block-makers, how do I get the HTML of my inner blocks to change the HTML that wraps them dynamically in PHP?

So I made my own plugin to add a custom block to my posts and I have a question. When I save my custom block in Javascript I’m using this

var blockProps ={
className: ‘curious–block curious–div’
return el(‘div’, blockProps, el(‘div’, { className: ‘curious–div__content’ }, el(window.wp.blockEditor.InnerBlocks.Content)));

Which basically saves this HTML

<div class=”wp-block-something curious–block curious–div”>
<div class=”curious–div__content”>
<!– insert inner blocks here –>

So my idea was that if I made my own blocks I’d be able to use `render_callback` to change the HTML of the blocks later, but when I actually tried to do it I kind of stuck.

The `$content` that is passed to the render callback’s second argument contains what I imagine is the HTML that I saved from Javascript plus the HTML generated by the inner blocks in PHP, which means I have the `<div class=”wp-block-something curious–block curious–div”>…` that I don’t want. I only want the HTML of the inner blocks but I can’t find a variable for that. I’m guessing it doesn’t exist. It does seem that I have a variable to access the inner blocks of my block instance. So I guess one solution would be to loop through these blocks and call the render block function to render?

Is this how it’s normally done? But then… WordPress will render all the blocks twice, once for $content and once when I do it. Is there a way to disable the default $content render? Should I just use a regex to extract the HTML instead? That could work but it sounds kind of backwards to be honest.

Thanks in advance!


This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer