RepoAI
Browse MCPs

WP Interactivity API

94TrustedInstructions only

WordPress Interactivity API configuration, state management, and debugging guidance.

What it does

This skill equips the assistant with specialized knowledge regarding the Interactivity API, focusing on how to align server-rendered HTML with client-side hydration. It ensures that state management and directive usage follow current WordPress development patterns to prevent common pitfalls during block development.

By installing this, the assistant gains access to specific patterns for defining stores, implementing server-side directive processing, and correctly mapping markup to interactive logic. It is intended for developers who need to bridge the gap between static PHP outputs and dynamic JavaScript behavior in WordPress environments.

When it earns its place

Reach for it when…

Apply this when building interactive blocks that require server-side rendering or when debugging issues where interactivity fails to initialize after a page load. It is the primary resource for setting up state namespaces, using modern directive syntax, and ensuring view scripts are correctly registered.

Look elsewhere when…

Do not use this for building traditional static blocks or for general WordPress AJAX implementations that do not utilize the Interactivity API. It is not intended for managing complex global state outside of the WordPress block ecosystem or for general theme development that does not involve client-side state hydration.

What to say to use it

You never invoke a skill directly — the assistant picks it up when your request matches what it covers. These are the kinds of things that do that.

  • How do I set up the initial state for my interactive block
  • Why are my data-wp directives not firing on the frontend
  • Show me the correct way to link a viewScriptModule to my block
  • How can I share state between server-side PHP and the client

Install it

Install for all your projects

Copy the skill directory into your personal skills folder. Claude picks it up on its own the next time your request matches what it does — there is nothing to enable.

bash
git clone --depth 1 --branch trunk https://github.com/WordPress/agent-skills.git /tmp/agent-skills
mkdir -p ~/.claude/skills
cp -r /tmp/agent-skills/skills/wp-interactivity-api ~/.claude/skills/wp-interactivity-api

Install for one project only

Put it in the project's own skills folder instead, so it can be committed and shared with everyone working on that repository.

bash
cp -r /tmp/agent-skills/skills/wp-interactivity-api .claude/skills/wp-interactivity-api

If a skill of the same name exists in both places, the personal one wins.

Installing on Claude.ai or through the API instead? The full guide covers every surface.

Pair it with an MCP server

WP Interactivity API changes how the work is done. These servers change what Claude can reach while doing it.

How skills and MCP servers differ →