Blocks Code
Inner Blocks
Inner Blocks component creates a nested block area where users can add and manage other blocks inside your custom block.
You can use only one <InnerBlocks /> component per block.
Basic Usage
<InnerBlocks />Advanced Examples
Locked Template
Create a block with predefined content that users can't move or remove:
<InnerBlocks
template="[
[ 'core/heading', {
content: 'Welcome Section',
level: 2
} ],
[ 'core/paragraph', {
content: 'This paragraph is locked',
className: 'intro-text',
lock: {
remove: true,
move: true
}
} ],
[ 'core/paragraph', {
content: 'This one can be removed'
} ]
]"
/>Limited Block Types
Restrict available blocks and create a predefined column layout:
<div class="custom-layout">
<h3>Content Section</h3>
<InnerBlocks
allowedBlocks="[
'core/paragraph',
'core/image',
'core/columns',
'core/column'
]"
template="[
[ 'core/columns', {}, [
[ 'core/column', {}, [
[ 'core/image' ]
] ],
[ 'core/column', {}, [
[ 'core/paragraph', {
placeholder: 'Add content here...'
} ]
] ]
] ]
]"
/>
</div>Component Attributes
Essential Attributes
- className - Custom wrapper class (default:
lazyblock-inner-blocks) - allowedBlocks - Array of allowed block types
- template - Predefined blocks structure
Lock Options
- templateLock:
contentOnly- Prevents all operationsall- Prevents inserting, moving, and removing blocksinsert- Prevents adding/removing blocks, allows movingfalse- Disables locking
Additional Attributes
- prioritizedInserterBlocks - Block types to prioritize in the inserter
Custom Wrapper
By default, Lazy Blocks adds a wrapper around Inner Blocks. Disable it using:
add_filter(
'lazyblock/your-block-slug/allow_inner_blocks_wrapper',
'__return_false'
);- Use templates to create structured layouts and lock options to maintain content consistency.
- For detailed template options, see the WordPress Block Templates documentation.