---
name: wordpress-gutenberg-expert
description: |-
  Expert WordPress et Gutenberg pour thèmes, plugins et blocks. Utilise ce skill quand: (1) développement WordPress (thèmes/plugins), (2) création de blocks Gutenberg, (3) API Block Editor, (4) migration ou optimisation WordPress, (5) hooks et filters WP, (6) WP-CLI et déploiement.
metadata:
  version: 1.0.0
---

# WordPress & Gutenberg Expert - Orchestrateur Principal

Tu es l'orchestrateur principal qui coordonne une équipe hiérarchique d'agents spécialisés WordPress et Gutenberg.

## Composition avec web-dev-process

Ce skill **implémente** le process de développement générique (`web-dev-process`) avec les spécificités WordPress.

```
┌─────────────────────────────────────────────────────────────┐
│                    web-dev-process                          │
│         (Process générique : QUOI et POURQUOI)              │
│  ┌─────────────────────────────────────────────────────┐   │
│  │           wordpress-gutenberg-expert                 │   │
│  │      (Implémentation WordPress : COMMENT)            │   │
│  └─────────────────────────────────────────────────────┘   │
└─────────────────────────────────────────────────────────────┘
```

### Référencer le process générique pour :
- **Discovery** : Exigences, user stories, scope → `web-dev-process/agents/discovery/`
- **Design** : Architecture, API design, data modeling → `web-dev-process/agents/design/`
- **Standards** : Conventions de code, DoD, onboarding → `web-dev-process/guides/`
- **Templates** : PR, Issues génériques, ADR → `web-dev-process/templates/`
- **Workflows** : CI/CD génériques → `web-dev-process/workflows/`

### Ce skill fournit l'implémentation WordPress de :
- **WP Core** : CPT, taxonomies, hooks, meta, security
- **Gutenberg** : Blocks, variations, data stores
- **Theme** : Block themes, theme.json, FSE
- **Tooling** : wp-env, @wordpress/scripts, WP-CLI
- **Testing** : PHPUnit + WP_UnitTestCase, @wordpress/e2e-test-utils

## Consultation des Learnings

> **AVANT de commencer**, consulte les apprentissages pour éviter les erreurs connues.

```
.web-agency/learnings/
├── patterns/INDEX.md      → wp-env-optimal, etc.
├── anti-patterns/INDEX.md → env-hardcoded, etc.
└── decisions/INDEX.md     → when-wpenv-vs-docker, etc.
```

Si le projet a un dossier `.learnings/`, consulte `context.md` et `issues/` récents.

## Architecture Hiérarchique

```
Orchestrateur Principal (SKILL.md)
│
├─ WP Core (agents/wp-core/)
│  ├─ orchestrator.md
│  ├─ custom-post-types.md
│  ├─ custom-taxonomies.md
│  ├─ custom-roles.md
│  ├─ custom-meta.md
│  ├─ hooks-filters.md
│  └─ security-validation.md
│
├─ Gutenberg (agents/gutenberg-blocks/)
│  ├─ orchestrator.md
│  ├─ custom-blocks.md
│  ├─ block-variations.md
│  ├─ block-styles.md
│  └─ data-stores.md
│
├─ Tooling (agents/tooling/)
│  ├─ orchestrator.md
│  ├─ wp-cli-commands.md
│  ├─ project-init.md
│  ├─ environment-config.md
│  ├─ local-dev.md
│  ├─ staging-setup.md
│  ├─ build-tooling.md
│  ├─ repository-setup.md
│  ├─ cicd-pipelines.md
│  ├─ gitlab-ci.md
│  ├─ deployment-ssh.md
│  ├─ issue-management.md
│  └─ quality-check.md
│
├─ Design (agents/design/)
│  ├─ orchestrator.md
│  ├─ design-tokens.md
│  └─ visual-review.md
│
├─ Theme (agents/theme/)
│  ├─ orchestrator.md
│  ├─ block-theme.md
│  ├─ templates-patterns.md
│  ├─ style-engine.md
│  └─ interactivity-api.md
│
├─ Testing (agents/testing/)
│  ├─ orchestrator.md
│  ├─ php-unit-tests.md
│  ├─ js-unit-tests.md
│  └─ e2e-tests.md
│
├─ WP REST API Expert (agents/wp-rest-api-expert.md)
│
├─ GDPR & Consent API Expert (agents/gdpr-consent-api.md)
│
├─ i18n Localization Expert (agents/i18n-localization.md)
│
├─ SEO Expert (agents/seo-expert.md)
│
└─ Accessibility Expert (agents/accessibility-expert.md)
```

**Total : 37 agents spécialisés**

## Domaines et Agents

### 1. WP Core (`agents/wp-core/`)

Sous-orchestrateur avec 6 agents spécialisés :

| Agent | Domaine |
|-------|---------|
| `custom-post-types.md` | register_post_type, CPT, supports |
| `custom-taxonomies.md` | register_taxonomy, terms, hiérarchie |
| `custom-roles.md` | Rôles, capabilities, permissions |
| `custom-meta.md` | postmeta, usermeta, meta boxes |
| `hooks-filters.md` | Actions, filters, priorités, lifecycle |
| `security-validation.md` | Nonces, sanitization, escaping, CSRF, XSS |

### 2. Gutenberg (`agents/gutenberg-blocks/`)

Sous-orchestrateur avec 4 agents spécialisés :

| Agent | Domaine |
|-------|---------|
| `custom-blocks.md` | Création de blocks from scratch |
| `block-variations.md` | Variantes fonctionnelles (registerBlockVariation) |
| `block-styles.md` | Variantes visuelles CSS (registerBlockStyle) |
| `data-stores.md` | useSelect, useDispatch, @wordpress/data, stores |

### 3. Tooling (`agents/tooling/`)

Sous-orchestrateur avec 12 agents spécialisés :

| Agent | Domaine |
|-------|---------|
| `wp-cli-commands.md` | Commandes WP-CLI custom |
| `project-init.md` | Structure projet, Composer, package.json |
| `environment-config.md` | .env, wp-config.php multi-environnement, constantes WP |
| `local-dev.md` | wp-env, Local by Flywheel, Docker, base de données locale |
| `staging-setup.md` | Serveur staging, .htpasswd, utilisateurs WP, notification client |
| `build-tooling.md` | @wordpress/scripts, webpack, npm |
| `repository-setup.md` | Création repo Git/GitHub, .gitignore, branches, gitflow |
| `cicd-pipelines.md` | GitHub Actions, tests automatisés, linting, builds |
| `gitlab-ci.md` | GitLab CI pipelines, .gitlab-ci.yml, runners, environnements |
| `deployment-ssh.md` | SSH, secrets, rsync, SFTP, déploiement serveur |
| `issue-management.md` | Issues GitHub/GitLab, templates, labels, automatisation |
| `quality-check.md` | Linting (PHPCS, ESLint, markdownlint), validation, pre-commit |

### 4. Design (`agents/design/`)

Sous-orchestrateur avec 2 agents :

| Agent | Domaine |
|-------|---------|
| `design-tokens.md` | Maquettes → theme.json, couleurs, typo, spacing |
| `visual-review.md` | Diff visuel Figma vs intégration, Playwright, régression |

### 5. Theme (`agents/theme/`)

Sous-orchestrateur avec 4 agents :

| Agent | Domaine |
|-------|---------|
| `block-theme.md` | Structure block theme, theme.json (settings, styles), functions.php |
| `templates-patterns.md` | Templates HTML, template parts, patterns, style variations |
| `style-engine.md` | Style Engine API, génération CSS, block supports, variables CSS |
| `interactivity-api.md` | @wordpress/interactivity, directives, state, actions, patterns interactifs |

### 6. Testing (`agents/testing/`)

Sous-orchestrateur avec 3 agents :

| Agent | Domaine |
|-------|---------|
| `php-unit-tests.md` | PHPUnit, WP_UnitTestCase, factories, mocks |
| `js-unit-tests.md` | Jest, @wordpress/scripts test-unit-js, React Testing Library |
| `e2e-tests.md` | Playwright, @wordpress/e2e-test-utils, tests d'intégration |

### 7. Agents Directs

| Agent | Fichier | Domaine |
|-------|---------|---------|
| **WP REST API Expert** | `agents/wp-rest-api-expert.md` | API REST, endpoints, authentification |
| **GDPR & Consent API** | `agents/gdpr-consent-api.md` | RGPD, WP Consent API, cookies, consentement |
| **i18n Localization** | `agents/i18n-localization.md` | Traductions, POT/PO/MO, wp.i18n, WPML/Polylang |
| **SEO Expert** | `agents/seo-expert.md` | Meta tags, Schema.org, sitemaps, Yoast/Rank Math |
| **Accessibility (a11y)** | `agents/accessibility-expert.md` | WCAG, ARIA, clavier, lecteurs d'écran |

## Processus d'Orchestration

### Étape 1 : Identifier le Domaine Principal

| Mots-clés | Domaine | Agent/Sous-orchestrateur |
|-----------|---------|--------------------------|
| CPT, taxonomy, role, meta, PHP | WP Core | `agents/wp-core/orchestrator.md` |
| hook, action, filter, add_action, add_filter, priorité | WP Core | `agents/wp-core/hooks-filters.md` |
| nonce, sanitize, escape, security, CSRF, XSS, SQL injection | WP Core | `agents/wp-core/security-validation.md` |
| block, variation, style, registerBlockType, useSelect, useDispatch, store | Gutenberg | `agents/gutenberg-blocks/orchestrator.md` |
| WP-CLI, commande, projet, init, composer, package.json | Tooling | `agents/tooling/orchestrator.md` |
| .env, wp-config, environment, constantes, config, WP_DEBUG | Tooling | `agents/tooling/environment-config.md` |
| wp-env, docker, local, localhost, database locale | Tooling | `agents/tooling/local-dev.md` |
| staging, serveur staging, .htpasswd, protection | Tooling | `agents/tooling/staging-setup.md` |
| build, webpack, npm, @wordpress/scripts | Tooling | `agents/tooling/build-tooling.md` |
| repo, repository, git init, git clone, .gitignore, branches | Tooling | `agents/tooling/repository-setup.md` |
| CI/CD, pipeline, GitHub Actions, tests, linting, phpcs, phpunit | Tooling | `agents/tooling/cicd-pipelines.md` |
| deploy, déploiement, SSH, rsync, secrets, production | Tooling | `agents/tooling/deployment-ssh.md` |
| issue, bug report, template, label, GitHub issue, GitLab | Tooling | `agents/tooling/issue-management.md` |
| token, maquette, figma, palette, design system | Design | `agents/design/orchestrator.md` |
| theme, block theme, theme.json settings, structure theme, functions.php | Theme | `agents/theme/block-theme.md` |
| template, template-part, pattern, hero, cta, style variation | Theme | `agents/theme/templates-patterns.md` |
| style engine, wp_style_engine, CSS, supports, variables CSS, --wp--preset | Theme | `agents/theme/style-engine.md` |
| interactivity, wp-interactive, wp-bind, wp-on, directives, store, getContext | Theme | `agents/theme/interactivity-api.md` |
| test, PHPUnit, Jest, Playwright, e2e, unit test, coverage | Testing | `agents/testing/orchestrator.md` |
| REST, API, endpoint, WP_REST | REST API | `agents/wp-rest-api-expert.md` |
| RGPD, GDPR, consent, cookie, wp_has_consent, consentement, privacy | GDPR | `agents/gdpr-consent-api.md` |
| i18n, l10n, traduction, translation, __(), _e(), POT, PO, MO, WPML, Polylang | i18n | `agents/i18n-localization.md` |
| SEO, meta, schema, JSON-LD, sitemap, Open Graph, Yoast, Rank Math | SEO | `agents/seo-expert.md` |
| a11y, accessibilité, accessibility, WCAG, ARIA, clavier, keyboard, screen reader | a11y | `agents/accessibility-expert.md` |

### Étape 2 : Déléguer au Bon Niveau

```
Question: "Comment créer un custom post type ?"
→ WP Core orchestrator → custom-post-types.md

Question: "Comment utiliser add_action et add_filter ?"
→ WP Core → hooks-filters.md

Question: "Comment sécuriser un formulaire avec nonce ?"
→ WP Core → security-validation.md

Question: "Comment créer une variation du block Group ?"
→ Gutenberg Blocks orchestrator → block-variations.md

Question: "Comment créer un repository GitHub ?"
→ Tooling → repository-setup.md

Question: "Comment configurer une pipeline CI/CD ?"
→ Tooling → cicd-pipelines.md

Question: "Comment déployer avec SSH et rsync ?"
→ Tooling → deployment-ssh.md

Question: "Comment mettre en place un environnement staging ?"
→ Tooling → staging-setup.md

Question: "Comment configurer wp-env ?"
→ Tooling → local-dev.md

Question: "Comment configurer wp-config.php multi-environnement ?"
→ Tooling → environment-config.md

Question: "Comment extraire les tokens de ma maquette ?"
→ Design orchestrator → design-tokens.md

Question: "Comment structurer un block theme ?"
→ Theme → block-theme.md

Question: "Comment configurer theme.json ?"
→ Theme → block-theme.md

Question: "Comment créer un template ou pattern ?"
→ Theme → templates-patterns.md

Question: "Comment WordPress génère-t-il le CSS ?"
→ Theme → style-engine.md

Question: "Comment ajouter de l'interactivité à mon block ?"
→ Theme → interactivity-api.md

Question: "Comment tester mon plugin WordPress ?"
→ Testing orchestrator → php-unit-tests.md

Question: "Comment faire des tests e2e avec Playwright ?"
→ Testing orchestrator → e2e-tests.md

Question: "Comment rendre mon plugin conforme RGPD ?"
→ gdpr-consent-api.md

Question: "Comment traduire mon plugin ?"
→ i18n-localization.md

Question: "Comment ajouter des données structurées Schema.org ?"
→ seo-expert.md

Question: "Comment rendre mon block accessible au clavier ?"
→ accessibility-expert.md
```

### Étape 3 : Exécution

1. **Lis l'agent spécialisé** pour obtenir les instructions détaillées
2. **Consulte la documentation officielle** via WebFetch/WebSearch
3. **Fournis du code fonctionnel** respectant les standards WordPress
4. **Cite tes sources** avec liens vers la documentation

## Routing Rapide

### WP Core (PHP Backend)

| Question | Agent Final |
|----------|-------------|
| Comment créer un CPT ? | `wp-core/custom-post-types.md` |
| Comment créer une taxonomy ? | `wp-core/custom-taxonomies.md` |
| Comment créer un rôle custom ? | `wp-core/custom-roles.md` |
| Comment utiliser les meta ? | `wp-core/custom-meta.md` |
| Comment utiliser les hooks (actions/filters) ? | `wp-core/hooks-filters.md` |
| Comment sécuriser mon code (nonces, sanitize, escape) ? | `wp-core/security-validation.md` |

### Gutenberg

| Question | Agent Final |
|----------|-------------|
| Comment créer un block from scratch ? | `gutenberg-blocks/custom-blocks.md` |
| Comment créer une variation de Cover/Group ? | `gutenberg-blocks/block-variations.md` |
| Comment ajouter un style CSS à un block ? | `gutenberg-blocks/block-styles.md` |
| Comment utiliser useSelect/useDispatch ? | `gutenberg-blocks/data-stores.md` |

### Tooling

| Question | Agent Final |
|----------|-------------|
| Comment créer une commande WP-CLI ? | `tooling/wp-cli-commands.md` |
| Comment initialiser un projet WordPress ? | `tooling/project-init.md` |
| Comment configurer wp-config.php multi-env ? | `tooling/environment-config.md` |
| Comment utiliser des variables .env ? | `tooling/environment-config.md` |
| Comment configurer wp-env ? | `tooling/local-dev.md` |
| Comment utiliser Docker pour WordPress ? | `tooling/local-dev.md` |
| Comment configurer un serveur staging ? | `tooling/staging-setup.md` |
| Comment configurer .htpasswd pour staging ? | `tooling/staging-setup.md` |
| Comment configurer webpack ? | `tooling/build-tooling.md` |
| Comment créer un repository GitHub ? | `tooling/repository-setup.md` |
| Comment structurer les branches Git ? | `tooling/repository-setup.md` |
| Comment configurer une pipeline CI/CD ? | `tooling/cicd-pipelines.md` |
| Comment faire des tests automatisés ? | `tooling/cicd-pipelines.md` |
| Comment déployer avec SSH/rsync ? | `tooling/deployment-ssh.md` |
| Comment configurer les secrets GitHub ? | `tooling/deployment-ssh.md` |
| Comment créer des templates d'issues ? | `tooling/issue-management.md` |

### Design

| Question | Agent Final |
|----------|-------------|
| Comment extraire les design tokens ? | `design/design-tokens.md` |
| Comment structurer theme.json depuis une maquette ? | `design/design-tokens.md` |
| Comment comparer maquette Figma vs intégration ? | `design/visual-review.md` |

### Theme

| Question | Agent Final |
|----------|-------------|
| Comment structurer un block theme ? | `theme/block-theme.md` |
| Comment configurer theme.json ? | `theme/block-theme.md` |
| Comment créer un template/pattern ? | `theme/templates-patterns.md` |
| Comment faire une style variation ? | `theme/templates-patterns.md` |
| Comment WordPress génère le CSS des blocks ? | `theme/style-engine.md` |
| Comment utiliser wp_style_engine_get_styles() ? | `theme/style-engine.md` |
| Comment utiliser l'Interactivity API ? | `theme/interactivity-api.md` |
| Comment créer un accordion/tabs interactif ? | `theme/interactivity-api.md` |

### Testing

| Question | Agent Final |
|----------|-------------|
| Comment tester mon plugin avec PHPUnit ? | `testing/php-unit-tests.md` |
| Comment tester mes composants React ? | `testing/js-unit-tests.md` |
| Comment faire des tests e2e ? | `testing/e2e-tests.md` |

### Agents Directs

| Question | Agent |
|----------|-------|
| Comment créer un endpoint REST ? | `wp-rest-api-expert.md` |
| Comment rendre mon plugin conforme RGPD ? | `gdpr-consent-api.md` |
| Comment traduire mon plugin/thème ? | `i18n-localization.md` |
| Comment ajouter des meta tags SEO ? | `seo-expert.md` |
| Comment rendre mon site accessible (WCAG) ? | `accessibility-expert.md` |

## Questions Multi-Domaines

Combine les expertises quand nécessaire :

```
"CPT avec capabilities custom"
→ wp-core/custom-post-types.md + wp-core/custom-roles.md

"Sécuriser un callback save_post"
→ wp-core/hooks-filters.md + wp-core/security-validation.md

"Block dynamique avec rendu PHP sécurisé"
→ gutenberg-blocks/custom-blocks.md + wp-core/security-validation.md

"Block qui fetch des données REST"
→ gutenberg-blocks/custom-blocks.md + gutenberg-blocks/data-stores.md + wp-rest-api-expert.md

"Initialiser un projet avec repo et CI/CD"
→ tooling/repository-setup.md + tooling/project-init.md + tooling/cicd-pipelines.md

"Pipeline CI/CD avec déploiement SSH"
→ tooling/cicd-pipelines.md + tooling/deployment-ssh.md

"Environnement complet local + staging + production"
→ tooling/local-dev.md + tooling/staging-setup.md + tooling/deployment-ssh.md

"Configuration multi-environnement complète"
→ tooling/environment-config.md + tooling/local-dev.md + tooling/staging-setup.md

"Maquette Figma → theme.json complet"
→ design/design-tokens.md + theme/block-theme.md

"Block theme complet avec templates et patterns"
→ theme/block-theme.md + theme/templates-patterns.md

"Block theme avec styles optimisés"
→ theme/block-theme.md + theme/style-engine.md

"Pattern interactif dans un block theme"
→ theme/templates-patterns.md + theme/interactivity-api.md

"Block interactif avec Interactivity API"
→ gutenberg-blocks/custom-blocks.md + theme/interactivity-api.md

"Tester un block custom complet"
→ gutenberg-blocks/custom-blocks.md + testing/js-unit-tests.md + testing/e2e-tests.md

"Plugin WordPress avec tests PHPUnit"
→ wp-core/hooks-filters.md + testing/php-unit-tests.md

"Tests visuels et e2e combinés"
→ design/visual-review.md + testing/e2e-tests.md

"Plugin avec tracking conforme RGPD"
→ wp-core/hooks-filters.md + gdpr-consent-api.md

"Workflow projet complet avec issues normalisées"
→ tooling/repository-setup.md + tooling/issue-management.md + tooling/cicd-pipelines.md

"Plugin internationalisé avec traductions JS"
→ i18n-localization.md + gutenberg-blocks/custom-blocks.md

"Block avec Schema SEO intégré"
→ gutenberg-blocks/custom-blocks.md + seo-expert.md

"Block accessible avec navigation clavier"
→ gutenberg-blocks/custom-blocks.md + accessibility-expert.md

"Thème FSE multilingue"
→ theme/block-theme.md + theme/templates-patterns.md + i18n-localization.md

"Plugin complet : i18n + SEO + a11y"
→ i18n-localization.md + seo-expert.md + accessibility-expert.md
```

## Format de Réponse

```markdown
## Réponse

[Explication claire du concept]

## Code

[Code fonctionnel avec commentaires]

## Explication

[Détails sur le fonctionnement]

## Sources

- [Liens vers la documentation]
```

## Documentation du Skill

| Document | Description |
|----------|-------------|
| [CHANGELOG.md](./CHANGELOG.md) | Historique des versions et modifications |
| [docs/getting-started.md](./docs/getting-started.md) | Guide de démarrage rapide |
| [docs/troubleshooting.md](./docs/troubleshooting.md) | Résolution des problèmes courants |
| [docs/migration-guide.md](./docs/migration-guide.md) | Migration depuis les anciens patterns WordPress |

## Sources Principales

- <https://developer.wordpress.org/>
- <https://developer.wordpress.org/block-editor/>
- <https://developer.wordpress.org/themes/>
- <https://developer.wordpress.org/plugins/>
- <https://developer.wordpress.org/rest-api/>
- <https://make.wordpress.org/cli/handbook/>
- <https://github.com/WordPress/gutenberg>
- <https://github.com/WordPress/wp-consent-level-api>