skills.rest
javiercasares
javiercasaresCOMMUNITY
Explore all skills by this author →
Website𝕏@JavierCasaresGitHub

wp-interactivity-api

Diagnose and implement WordPress Interactivity API features with data-wp directives.

1|Updated Jan 31, 2026
Search Tags:#debugging#hydration#data-wp-directives#wordpress-interactivity#store-state-actions#block-viewScriptModule
One-click install
npx skills add https://github.com/javiercasares/cloudfest-wporgdownload --skill wp-interactivity-api-javiercasares
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: wp-interactivity-api
Source: https://github.com/javiercasares/cloudfest-wporgdownload/tree/main/.claude/skills/wp-interactivity-api
Command: npx skills add https://github.com/javiercasares/cloudfest-wporgdownload --skill wp-interactivity-api-javiercasares

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers diagnose and implement WordPress Interactivity API features, including data-wp-* directives, stores, and hydration, across blocks, themes, and plugins.

Core Features & Use Cases

  • Guided triage for data-wp directives, interactivity stores, and directive behavior.
  • Server-side rendering guidance for interactivity to improve initial load and hydration reliability.
  • Hands-on debugging templates and checklists for common failures (viewScriptModule loading, directive processing, store naming, and context).
  • Use Case: A developer debugging a malfunctioning data-wp-on--click directive on a block can follow this skill to verify directives, stores, and hydration paths.

Quick Start

Start by describing the interactivity issue you’re facing to this skill, then request a triage and debugging plan based on the Interactivity API.

Frequently Asked Questions about wp-interactivity-api

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I debug a data-wp-on--click directive that is not firing in my WordPress block?▼

Triage the malfunctioning data-wp directive by verifying the interactivity store state, actions, and hydration paths. Check store naming conventions and ensure the viewScriptModule is correctly loading to process the click event.

Why does my WordPress Interactivity API block fail to hydrate on the client side?▼

Hydration failures in the WordPress Interactivity API typically stem from server-side rendering mismatches or incorrect viewScriptModule loading. Align server-side rendering output with client-side store initialization to restore reliable hydration.

What is the best way to structure an interactivity store for a custom WordPress block?▼

Structuring an interactivity store requires defining clear state and actions mapped directly to your data-wp directives. Use debugging checklists to validate store naming, context, and directive behavior within the block viewScriptModule.

Do I need WP-CLI to troubleshoot Interactivity API store state issues?▼

Troubleshooting store state issues may involve a filesystem-based agent using bash and Node.js, with some workflows requiring WP-CLI. Knowledge of WordPress 6.9+ Interactivity API concepts is necessary to diagnose these features effectively.

How to fix viewScriptModule loading errors during WordPress block interactivity processing?▼

Fix viewScriptModule loading errors by following hands-on debugging checklists that verify script enqueuing and module integration. Ensure the block viewScriptModule is properly registered to handle the interactivity directives.

Related Skills

Explore More Software Engineering Skills→
HungNthHungNth

wp-interactivity-api

Diagnose and implement WordPress Interactivity API directives and store integration.

Community
Advanced
josecontijoseconti
2

wp-interactivity-api

Diagnose WordPress Interactivity API directive issues across blocks, themes, and plugins.

Community
Advanced
yopitekyopitek

magazine-web-ppt

Generate a single-file HTML magazine-style slide deck with WebGL background.

Community
Advanced
ToonVosToonVos
2

wasp-auth

Configure authentication and user management for Wasp applications.

Community
Intermediate