Skip to content

Latest commit

 

History

History
36 lines (24 loc) · 5.98 KB

README.md

File metadata and controls

36 lines (24 loc) · 5.98 KB
Raw

Interactive Router (regions) 2f43f8

Info The Interactivity API, introduced in WordPress 6.5, provides a standard way for developers to add interactions to the front end of their blocks.

Folder Short description Tags ID (❓) Download .zip Live Demo
📁 Interactivity Router (regions) example INTERACTIVITY API, INTERACTIVITY ROUTER 2f43f8 📦

Understanding the Example Code

The interactivity-router-2f43f8 block allows to have inner blocks wrapped in the region with ID region-example-2f43f8. This allows to have different instances of the block with different content.

When navigation happens from a page A with regionregion-example-2f43f8to another page B with region region-example-2f43f8 and that navigation is done via using actions.navigate (from wordpress/interactivity-router), then the content from region region-example-2f43f8 on B is brought to region region-example-2f43f8 on A. The URL is also update in the client side.

This example contains:

  • A block that can contain inner blocks
  • A block with attributes prev and next and Inspector controls to edit this values
  • The markup used in render.php uses the directive data-wp-router-region to establish a router region which content may vary on each instance of the block.

Related resources

Check the following resources for more info about the Interactivity API:

Note Check the Start Guide for local development with the examples