Introducing Block Hooks for Dynamic Blocks  ## Metadata - Author: [[Make WordPress Core]] - Full Title: Introducing Block Hooks for Dynamic Blocks - Category: #articles - Document Note: --- tags: - #wordpress - #blockhooks - #development Author: Nick Diego Source: Make WordPress Core Reference: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/ date created: 2025-08-23 00:00 --- # Title: Introducing Block Hooks for Dynamic Blocks (WordPress 6.4) ## Table of Contents: - [📝 Summary](#-summary) - [📖 Main Content](#-main-content) - [🗒️ Notes](#-notes) - [📖 References](#-references) - [🗣️ Paraphrase](#-paraphrase) - [📰 Newsletter](#-newsletter) - [✅ Action Items](#-action-items) - [🧪 Hypotheses](#-hypotheses) - [📊 Methodology](#-methodology) - [❓ Questions](#-questions) - [🔮 Future Research](#-future-research) - [💡 Implications](#-implications) - [🧠 Learning Styles Assessment](#-learning-styles-assessment) - [📊 Accessibility Assessment](#-accessibility-assessment) - [🌍 DEIB Assessment](#-deib-assessment) - [✅ Logical validity](#-logical-validity) - [🔍 DARVO Analysis Prompt](#-darvo-analysis-prompt) - [🔍 SEO Evaluation](#-seo-evaluation) - [🎯 Conclusion](#-conclusion) ### References: - Make/Core Dev Note: Introducing Block Hooks for dynamic blocks — https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/ - WordPress 6.4 release news — https://wordpress.org/news/2023/10/wordpress-6-4/ ## 📝 Summary: WordPress 6.4 adds Block Hooks, an extensibility mechanism for Block Themes that lets a block automatically insert itself relative to other blocks. It mirrors classic filters/actions patterns for the block era. Two guiding tenets govern the feature: automatic front-end insertion on plugin activation and user control in the editor. Current scope limits insertion to templates, template parts, and patterns (not user-modified content), and to dynamic blocks (static blocks with save functions trigger validation errors). Developers can declare hooks via block.json (simple/unconditional) or the hooked_block_types filter (flexible/conditional, with context awareness). ## 📖 Main Content: Block Hooks allow plugins to programmatically extend block-based sites without manual placement. Typical use cases: inject a Like button before Post Content, add a Login/Logout after a header Navigation, or append UI elements inside container blocks as first or last child. Two implementation paths: - block.json blockHooks: Unconditional insertions relative to all instances of target blocks where templates are unmodified. Positions: before, after, firstChild, lastChild. When injected as first/last child, an Editor “Plugins” panel appears on the target block to toggle insertions. - hooked_block_types filter: Allows conditional insertion using the context (template, template part, or pattern) and anchor block position, with parameters for the hooked blocks list, position, anchor block name, and context. Context types differ: WP_Block_Template object for templates/parts, array for patterns. Constraints and tradeoffs: - To honor automatic insertion and user control, hooks are confined to theme layout sources: templates, template parts, and patterns (theme-provided, directory, or registered programmatically). - Not supported: user-modified templates/parts, post content, user-authored patterns, and static blocks (those with save functions). - Only default block instances can be inserted; attributes cannot be set yet. Improvements are planned. Practical implications: - Plugin authors can ship opinionated default placements without overwriting user content. - Theme authors retain layout integrity while giving users control via the editor. - Site owners benefit from consistent, upgrade-safe enhancements. ### 🗒️ Notes - Concept and purpose - Emulates classic hooks for block themes to extend layouts. - Automatic, relative placement around “anchor” blocks. - Core tenets - Auto front-end insertion upon plugin activation; removal upon deactivation. - Users retain full editor control to keep/remove/move/customize the inserted block. - Scope and limitations - Works only in templates, template parts, patterns (theme or directory or registered). - Excludes post content, user-modified templates/parts, and user-created patterns. - Dynamic blocks only; static blocks with save() cause validation errors. - Inserted blocks use default attributes; attribute customization is not yet supported. - Implementation options - block.json - blockHooks object maps anchor block → position (before, after, firstChild, lastChild). - Applies unconditionally to all qualifying instances. - Editor adds “Plugins” settings panel for firstChild/lastChild to toggle injected blocks. - hooked_block_types filter - Conditional logic by template slug (e.g., single), template part area (e.g., header), or pattern slug. - Parameters: $hooked_blocks, $position (before/after/first_child/last_child), $anchor_block, $context (object/array). - Must type-check $context. - Examples - Insert Like button before core/post-title in Single template. - Insert core/loginout as last child of a header template part group/navigation. - Insert Like button after core/post-terms inside a specific pattern (e.g., twentytwentyfour/post-meta). - Future improvements - Attribute-setting on inserted instances. - Broader scope and robustness tracked in the feature’s improvement issue(s). Direct links to sections/examples in the article: - Introduction to Block Hooks: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/ - Tenets and limitations: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/#:~:text=Tenets%20and%20current%20limitations - Using Block Hooks: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/#:~:text=Using%20Block%20Hooks - block.json positions: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/#:~:text=block.json - hooked_block_types filter and parameters: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/#:~:text=hooked_block_types - Context type notes and future improvements: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/#:~:text=It%E2%80%99s%20important%20to%20note%20that ## 📖 References: - Make/Core: Introducing Block Hooks for dynamic blocks — https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/ - WordPress 6.4 announcement — https://wordpress.org/news/2023/10/wordpress-6-4/ ## 🗣️ Paraphrase: - Original idea: “The Block Hooks API allows a block to automatically insert itself relative to instances of other block types.” - Paraphrase: The API lets one block declare where it should appear in relation to another block, and WordPress places it there automatically. - Original idea: “The user has the ultimate control over any automatically inserted blocks.” - Paraphrase: Even when a plugin adds blocks for you, you can still remove, move, or customize them in the editor, and your choices take precedence. ## 📰 Newsletter: This week in WordPress: Hooks, but make them blocks. WordPress 6.4 shipped Block Hooks, letting plugins auto-insert dynamic blocks right where they belong—before, after, or inside other blocks—without mucking up your content. Think: a Like button slotted after Post Terms, or Login/Logout neatly tucked into your header nav. Users stay in control via the editor, and disabling a plugin removes its additions automatically. Heads-up: Block Hooks currently work in templates, template parts, and patterns, and only for dynamic blocks. Explore the dev note for examples and best practices in “Introducing Block Hooks for dynamic blocks” on Make/Core. For new builders, this is a great moment to learn how block.json and filters like hooked_block_types can supercharge extensibility. Plus, keep an eye on upcoming improvements like attribute configuration on inserted blocks. Happy hooking! Link: Introducing Block Hooks — https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/ ## ✅ Action Items: Audience: Developer Advocate at GoDaddy (open source/WordPress), educator, contributor onboarding, sustai - Document Tags: [[wordpress]] [[wordpress 6.4]] - Summary: WordPress 6.4 introduces Block Hooks, a feature that allows developers to extend Block Themes by automatically inserting blocks relative to other block types. This feature is the first step in emulating WordPress' Hooks concept. Block Hooks have two core tenets: front-end insertion should happen when the plugin is activated, and the user has control over any automatically inserted blocks. However, there are limitations to Block Hooks, such as only being able to hook into templates, template parts, and patterns, and not being able to automatically insert blocks with save functions. Block Hooks can be implemented using the block.json file or the hooked_block_types filter. - URL: https://make.wordpress.org/core/2023/10/15/introducing-block-hooks-for-dynamic-blocks/ WordPress 6.4 introduces Block Hooks ([#53987](https://github.com/WordPress/gutenberg/issues/53987)), a feature that provides an extensibility mechanism for Block Themes. This is the first step in emulating WordPress’ [Hooks](https://developer.wordpress.org/plugins/hooks/) concept that allows developers to extend Classic Themes using filters and actions. Specifically, the Block Hooks API allows a block to automatically insert itself relative to instances of other block types. For example, a “Like” button block can ask to be inserted before the Post Content block, or an eCommerce shopping cart block can ask to be inserted after the Navigation block. #### Tenets and current limitations There are two core tenets of Block Hooks: 1. Front-end insertion should happen as soon as the plugin containing a hooked block is activated. In other words, the user isn’t required to insert the block in the Editor manually. Similarly, disabling the plugin should remove the hooked block from the front end. 2. The user has the ultimate control over any automatically inserted blocks. This means that a hooked block is visible in the Editor, and the user’s decision to keep, remove, customize, or move the block will be respected and reflected on the front end. To account for both tenets, tradeoffs had to be made. Block hooks are limited to templates, template parts, and patterns (i.e., the elements that define the layout of the theme). For patterns, this includes those provided by the theme, from [Block Pattern Directory](https://wordpress.org/patterns/), or from calls to [`register_block_pattern`](https://developer.wordpress.org/reference/functions/register_block_pattern/). Blocks cannot be hooked into post content or patterns crafted by the user, such as synced patterns or theme templates and template parts that the user has modified. Furthermore, as of WordPress 6.4, you can’t automatically insert blocks that have a save function, or block validation errors will occur. In colloquial terms, this means that Block Hooks work with Dynamic blocks, not Static blocks. Refer to [this article](https://developer.wordpress.org/news/2023/02/static-vs-dynamic-blocks-whats-the-difference/) on the difference between the two. #### Using Block Hooks You can implement Block Hooks in two different ways: in a block’s `block.json` file or using the new `hooked_block_types` filter. While simpler, the `block.json` method provides a more limited implementation, so let’s review that first. ##### `block.json` The `block.json` method allows you to hook a third-party block unconditionally, meaning that the block will be inserted relative to **all** instances of the target (anchor) block provided the abovementioned limitations. In the block’s `block.json` file, include the `blockHooks` property. This property takes an object where the key (`string`) is the name of the block you want to hook into, and the value (`string`) specifies its position. Possible positions are: * `before` – inject before the target block. * `after` – inject after the target block. * `firstChild` – inject before the first inner block of the target container block. * `lastChild` – inject after the last inner block of the target container block. ``` { blockHooks: { 'core/verse': 'before' 'core/spacer': 'after', 'core/column': 'firstChild', 'core/comment-template': 'lastChild', } } ``` In the example above, the block will be inserted *before* every Verse block that appears in an unmodified template, template part, or pattern. It will also be inserted *after* every Spacer block, etc. When using the `block.json` method with `firstChild` or `lastChild`, a Setting Sidebar panel titled **Plugins** will be added to the target block in the Editor. This allows the user to toggle on and off the hooked block. Below is an example of a Like button block that is hooked to the `lastChild` position in the Comment Template block. [](https://make.wordpress.org/core/files/2023/10/image.png) #### `hooked_block_types` The `hooked_block_types` filter provides more flexibility. It allows you to hook any Dynamic block unconditionally, like the `block.json` method, or conditionally based on the template, template part, or pattern where the target (anchor) block is located. The callback function for the filter accepts four parameters: * `$hooked_blocks` *(array)* – An array of hooked blocks. * `$position` *(string)* – The relative position of the hooked block: `before`, `after`, `first_child`, or `last_child`. * `$anchor_block` *(string)* – The name of the anchor block. * `$context` *(WP\_Block\_Template|array)* – The block template, template part, or pattern the anchor block belongs to. Below are a few examples using the [Like button block](https://github.com/ockham/like-button) plugin (`ockham/like-button`) built to demonstrate Block Hooks functionality in a third-party block. The pattern example does require the Twenty Twenty-Four theme. ``` function example_block_hooks( $hooked_blocks, $position, $anchor_block, $context ) { // Template/Template Part hooks. if ( $context instanceof WP_Block_Template ) { // Hooks the "Like" button block before the Post Title in the Single template. if ( 'core/post-title' === $anchor_block && 'before' === $position && 'single' === $context->slug ) { $hooked_blocks[] = 'ockham/like-button'; } // Hooks the Login/Logout link block after the Navigation block if the context of the template part is a header. if ( 'core/group' === $anchor_block && 'last_child' === $position && 'header' === $context->area ) { $hooked_blocks[] = 'core/loginout'; } } // Pattern hooks. if ( is_array( $context ) && isset( $context['slug'] ) ) { // Hooks into the Post Meta pattern in the Twenty Twenty-Four theme. if ( 'core/post-terms' === $anchor_block && 'after' === $position && 'twentytwentyfour/post-meta' === $context['slug'] ) { $hooked_blocks[] = 'ockham/like-button'; } } return $hooked_blocks; } add_filter( 'hooked_block_types', 'example_block_hooks', 10, 4 ); ``` It’s important to note that `$context` will be an `object` of type `WP_Block_Template` for templates and template parts and an `array` for patterns. If you want to insert blocks conditionally using this parameter, make sure to check the parameter type before applying hooking blocks. You will also note that you can only specify the name of the block that is being hooked. There is no way to set the attributes of the hooked block, so only the default instance of the block is inserted. Future improvements to Block Hooks will likely account for this limitation and others, providing a robust way for developers to extend Block Themes. For more information on what additional features are currently being worked on, stay tuned to the [tracking issue](https://github.com/WordPress/gutenberg/issues/54904) for Block Hook improvements. [#6-4](https://make.wordpress.org/core/tag/6-4/), [#dev-notes](https://make.wordpress.org/core/tag/dev-notes/), [#dev-notes-6-4](https://make.wordpress.org/core/tag/dev-notes-6-4/), Introducing Block Hooks for Dynamic Blocks, Make WordPress Core, 01hcwncdx7tpqkc012t1xe3243.