Ask any question about WordPress here... and get an instant response.
Post this Question & Answer:
How can I create a custom Gutenberg block with dynamic content?
Asked on Feb 18, 2026
Answer
Creating a custom Gutenberg block with dynamic content in WordPress involves registering a block and using server-side rendering to fetch and display dynamic data. This process typically requires both JavaScript for the block editor and PHP for dynamic content handling.
<!-- BEGIN COPY / PASTE -->
// JavaScript: Register the block
wp.blocks.registerBlockType('myplugin/dynamic-block', {
title: 'Dynamic Block',
icon: 'smiley',
category: 'widgets',
edit: function() {
return wp.element.createElement('p', {}, 'Dynamic Block Content');
},
save: function() {
return null; // Rendered in PHP
}
});
// PHP: Render the block with dynamic content
function render_dynamic_block() {
$content = '<p>' . get_dynamic_content() . '</p>';
return $content;
}
register_block_type('myplugin/dynamic-block', array(
'render_callback' => 'render_dynamic_block',
));
function get_dynamic_content() {
// Fetch or generate dynamic content
return 'This is dynamic content!';
}
<!-- END COPY / PASTE -->Additional Comment:
- Ensure you enqueue your JavaScript file using "wp_enqueue_script" in your plugin or theme functions file.
- Use "register_block_type" in PHP to define the block's server-side rendering logic.
- Dynamic content can be fetched from the database, external APIs, or generated based on conditions.
- Consider using the "wp-cli" tool for easier block scaffolding if you're comfortable with command-line interfaces.
Recommended Links:
