WordPress Playground: CLI, Blueprints e IA — Guia Completo 2026

O WordPress Playground evoluiu muito além de um simples site rodando no navegador. Se você ainda o compara ao XAMPP ou ao LocalWP, está perdendo um ecossistema completo de ferramentas para desenvolvimento, testes e automação com IA.

Durante o lançamento do My WordPress, uma questão apareceu com frequência nas conversas com desenvolvedores: “Por que eu usaria o Playground se prefiro meu ambiente local? O Playground não parece um ambiente real.”

A resposta é simples: o WordPress Playground hoje é um guarda-chuva robusto de soluções: CLI para desenvolvimento local, Blueprints para ambientes instantâneos e integração com agentes de IA via MCP.

Neste guia, vou mostrar como cada peça funciona na prática.

As três APIs do WordPress Playground: do mais simples ao mais poderoso

Antes de mergulhar na CLI, vale entender que o Playground expõe três APIs, em ordem crescente de controle.

A Query API é a mais simples: você customiza o Playground mexendo na própria URL de playground.wordpress.net. Para abrir já com um plugin instalado, basta adicionar ?plugin=:

https://playground.wordpress.net/?plugin=coblocksCode language: JavaScript (javascript)

Dá para repetir parâmetros e combinar plugin, tema e versões de WordPress e PHP. É o botão “teste você mesmo” ideal para um tutorial — sem código, só um link:

https://playground.wordpress.net/?plugin=coblocks&theme=pendant&wp=6.5&php=8.3Code language: JavaScript (javascript)

Quando a URL não dá conta — criar posts, rodar PHP, importar conteúdo — você sobe para os Blueprints, o arquivo JSON que é o foco da próxima seção.

No topo do controle está a JavaScript API: o pacote @wp-playground/client deixa você controlar a instância por código, a partir de um iframe:

<iframe id="wp" style="width:100%;height:300px;"></iframe>
<script type="module">
  import { startPlaygroundWeb } from 'https://playground.wordpress.net/client/index.js';
  const client = await startPlaygroundWeb({
    iframe: document.getElementById('wp'),
    remoteUrl: 'https://playground.wordpress.net/remote.html',
  });
  await client.isReady();
</script>Code language: HTML, XML (xml)

Regra prática: comece pela Query API, suba para Blueprints quando precisar de mais controle, e só vá para a JavaScript API quando precisar realmente programar a instância.

WordPress Playground CLI: O Poder da Linha de Comando e Testes E2E

A porta de entrada do WordPress Playground é o site playground.wordpress.net. Mas a verdadeira mágica para desenvolvedores acontece nos bastidores, com o Playground CLI (@wp-playground/cli).

Essa ferramenta de linha de comando cria ambientes WordPress completos para temas e plugins, com dependência zero de configurações complexas de servidor local. O único pré-requisito é o Node.js 20.18 ou superior.

Início rápido com o WordPress Playground CLI

O CLI oferece dois comandos principais:

start (simplificado)Detecta automaticamente o tipo do seu projeto, persiste o site entre sessões e abre o navegador.
server (avançado): controle manual completo, ideal para CI/CD e setups personalizados.

Para iniciar um ambiente WordPress com seu plugin montado automaticamente, basta:

cd meu-plugin
npx @wp-playground/cli@latest startCode language: CSS (css)

O CLI detecta que você está em um diretório de plugin e monta tudo automaticamente. A instância fica disponível em http://localhost:9400.

Para cenários mais avançados, o comando server oferece controle total:

# Montar plugin manualmente com versão específica do WordPress e PHP
npx @wp-playground/cli@latest server \
  --wp=6.8 --php=8.3 \
  --mount=.:/wordpress/wp-content/plugins/meu-plugin \
  --loginCode language: CSS (css)

Se você vem de ferramentas como XAMPP ou LocalWP, essa experiência vai parecer familiar, mas com a vantagem de não precisar instalar Apache, MySQL nem PHP na sua máquina.

Testes E2E com o WordPress Playground

Como o Playground roda inteiramente em JavaScript (via Node.js e WebAssembly), ele se tornou uma ferramenta poderosa para testes End-to-End (E2E). A portabilidade alcançou um nível tão alto que o próprio Core do WordPress já utiliza o Playground em seu fluxo de testes.

A API programática permite controlar o WordPress Playground diretamente no código. Aqui um exemplo de teste de integração com Vitest:

import { describe, test, expect, afterEach } from 'vitest';
import { runCLI, RunCLIServer } from "@wp-playground/cli";

describe('Testes do Meu Plugin', () => {
  let cliServer: RunCLIServer;

  afterEach(async () => {
    if (cliServer) {
      await cliServer[Symbol.asyncDispose]();
    }
  });

  test('plugin ativa com sucesso', async () => {
    cliServer = await runCLI({
      command: 'server',
      mount: [{
        hostPath: './meu-plugin',
        vfsPath: '/wordpress/wp-content/plugins/meu-plugin'
      }],
      blueprint: {
        steps: [{
          step: 'activatePlugin',
          pluginPath: '/wordpress/wp-content/plugins/meu-plugin/plugin.php'
        }]
      }
    });

    const response = await fetch(new URL('/', cliServer.serverUrl));
    expect(response.status).toBe(200);
  });
});Code language: JavaScript (javascript)

Com isso, desenvolvedores ao redor do mundo podem testar Pull Requests do Core do WordPress ou do Gutenberg acessando simplesmente uma URL gerada dinamicamente.

A extensão do VS Code: Playground sem sair do editor

Se você prefere não usar o terminal, existe a extensão oficial do VS Code (“WordPress Playground”). Ela já vem com uma versão portátil do PHP em WebAssembly e configura o WordPress com SQLite. Depois de instalar, basta clicar em Start WordPress Server — sem Apache, sem MySQL. É o caminho mais curto para quem já vive dentro do editor.

WordPress Playground Blueprints: Ambientes Instantâneos com JSON

Os Blueprints são outro recurso transformador do WordPress Playground. Pense neles como receitas JSON que configuram um ambiente WordPress completo em segundos.

Com um Blueprint, você pode criar demonstrações interativas e complexas de seus plugins. É possível configurar o WordPress em um ponto muito específico:

Instalando e ativando temas e plugins automaticamente;
Injetando dados simulados (posts, páginas, usuários);
Forçando cenários de erro para testar como sua aplicação reage.

Tudo isso sem precisar instalar um banco de dados ou configurar um servidor Apache/Nginx.

Exemplo: Blueprint básico do WordPress Playground

O Blueprint mais simples é um JSON vazio ({}), que já inicia um WordPress com a versão mais recente. Mas o poder real aparece quando você começa a configurar:

{
  "$schema": "https://playground.wordpress.net/blueprint-schema.json",
  "plugins": ["akismet", "gutenberg"],
  "steps": [
    {
      "step": "installTheme",
      "themeData": {
        "resource": "wordpress.org/themes",
        "slug": "twentynineteen"
      }
    }
  ],
  "siteOptions": {
    "blogname": "Meu Blog de Testes",
    "blogdescription": "Ambiente criado via Blueprint"
  },
  "constants": {
    "WP_DEBUG": true
  }
}Code language: JSON / JSON with Comments (json)

Este Blueprint instala os plugins Akismet e Gutenberg, aplica o tema Twenty Nineteen, define o nome do site e habilita o modo de depuração. Tudo em um único arquivo.

Como executar um Blueprint

Existem três formas principais de usar Blueprints no WordPress Playground:

1. Direto na URL do Playground (ideal para demos rápidas):

https://playground.wordpress.net/#{"preferredVersions":{"php":"8.3","wp":"6.8"}}Code language: JavaScript (javascript)

2. Via parâmetro blueprint-url (para Blueprints complexos hospedados no GitHub):

https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/seu-usuario/repo/main/blueprint.jsonCode language: JavaScript (javascript)

3. Via Playground CLI (para desenvolvimento local):

npx @wp-playground/cli@latest server --blueprint=meu-blueprint.jsonCode language: CSS (css)

Exemplo prático: Testando um plugin com dados simulados

Imagine que você quer demonstrar seu plugin de e-commerce com produtos já cadastrados:

{
  "$schema": "https://playground.wordpress.net/blueprint-schema.json",
  "preferredVersions": {
    "php": "8.3",
    "wp": "latest"
  },
  "plugins": ["woocommerce"],
  "landingPage": "/wp-admin/",
  "login": true,
  "steps": [
    {
      "step": "installPlugin",
      "pluginData": {
        "resource": "wordpress.org/plugins",
        "slug": "woocommerce"
      }
    },
    {
      "step": "setSiteOptions",
      "options": {
        "blogname": "Loja Demo",
        "blogdescription": "Demonstração com WooCommerce"
      }
    }
  ]
}Code language: JSON / JSON with Comments (json)

Exemplo prático: Blueprint com CLI e montagem de plugin

Você também pode combinar Blueprints com montagem de diretórios locais pelo CLI:

npx @wp-playground/cli@latest server \
  --blueprint=meu-blueprint.json \
  --mount=./meu-plugin:/wordpress/wp-content/plugins/meu-pluginCode language: CSS (css)

Com o arquivo meu-blueprint.json:

{
  "landingPage": "/wp-admin/plugins.php",
  "login": true,
  "steps": [
    {
      "step": "activatePlugin",
      "pluginPath": "/wordpress/wp-content/plugins/meu-plugin/plugin.php"
    }
  ]
}Code language: JSON / JSON with Comments (json)

Isso instala seu plugin local no WordPress Playground e o ativa automaticamente.

Por que usar Blueprints no seu fluxo de trabalho

Consistência: cada novo ambiente começa com a mesma configuração.
Colaboração: arquivos JSON fáceis de versionar no GitHub e revisar em PRs.
Produtividade: elimina o setup manual repetitivo de cada projeto.
Dependências atualizadas: sempre puxam a versão mais recente do WordPress, dos plugins e dos temas.
Integração com WordPress.org: você pode oferecer uma demonstração interativa do seu plugin diretamente no diretório oficial.

Dica: se você usa VS Code ou PHPStorm, adicione o $schema no topo do seu blueprint.json para ter autocompletar completo dos campos disponíveis.

Para um exemplo real de como Blueprints e agentes de IA trabalham juntos, veja o post WordPress Playground: O elo perdido entre Agentes de IA e Código Real.

WordPress Playground e IA: O Sandbox Perfeito para Agentes de Desenvolvimento

A popularização dos agentes de Inteligência Artificial para desenvolvimento elevou o WordPress Playground a um status de ferramenta indispensável. Ele resolve um problema crítico: como dar à IA acesso a um ambiente WordPress real sem arriscar sua máquina ou banco de dados.

Por meio de Agent Skills e do servidor MCP (Model Context Protocol), desenvolvedores e assistentes de IA (como Claude Code, Gemini CLI, Cursor) ganharam um superpoder: um sandbox seguro para testar código WordPress.

Agent Skills: Ensinando a IA a usar o WordPress Playground

A skill wp-playground é um conjunto de arquivos Markdown que ensinam ao seu agente de codificação a operar o Playground CLI. A instalação é simples:

npx skills add wordpress/agent-skills --skill wp-playground

A skill é instalada no diretório correspondente ao seu agente:

Agente	Diretório da skill
Claude Code	`.claude/skills/wp-playground/`
Gemini CLI	`.gemini/skills/wp-playground/`
GitHub Copilot	`.github/skills/wp-playground/`
Cursor	`.cursor/skills/wp-playground/`

Com a skill instalada, basta descrever o que você precisa em linguagem natural:

> Execute uma instância WordPress com meu plugin montado

> Crie um site WordPress com WooCommerce, 3 categorias de produtos,
  10 produtos de exemplo e 2 contas de clientes — rodando no PHP 8.2Code language: CSS (css)

> Teste meu plugin no WordPress 6.3 com PHP 7.4Code language: CSS (css)

O agente lê a referência da skill, constrói o Blueprint adequado, executa os comandos do CLI e inicia o servidor — tudo automaticamente. Para entender melhor como skills e MCP funcionam na prática, recomendo o post “Agentes de IA para Desenvolvedores: Entenda Rules, Skills, MCP e como usar cada um”.

O Servidor MCP do WordPress Playground

O servidor MCP permite que a Inteligência Artificial:

Inicie um ambiente de testes dinâmico no terminal.
Escreva, teste e experimente códigos livremente.
Faça requisições e verifique resultados reais no WordPress.

Tudo isso sem o risco de alucinações da IA quebrarem o seu ambiente de produção ou corromperem os bancos de dados locais. Se a IA cometer um erro catastrófico, basta encerrar o processo e o ambiente desaparece, mantendo sua máquina intacta.

Essa integração entre o WordPress Playground e a IA faz parte de um movimento maior. O WordPress 7.0 já traz iniciativas oficiais de IA no Core, incluindo um PHP AI Client e a Abilities API.

Conclusão: O WordPress Playground é o futuro do desenvolvimento local

O WordPress Playground deixou de ser um experimento de navegador para se tornar uma plataforma completa no arsenal do desenvolvedor moderno. Ele oferece:

CLI para ambientes locais sem dependências complexas.
Blueprints para configurações instantâneas e reprodutíveis.
MCP e Agent Skills para integração segura com agentes de IA.

Se você ainda não incluiu o WordPress Playground no seu fluxo de trabalho, comece pelo CLI — é a forma mais rápida de sentir a diferença. Depois, explore os Blueprints para padronizar seus ambientes e, por fim, conecte seus agentes de IA via MCP para automatizar tarefas repetitivas.

Qual ferramenta do ecossistema do WordPress Playground mais chamou sua atenção? Deixe nos comentários!

Um lembrete honesto sobre os limites: o Playground no navegador é efêmero por design — um refresh da página (F5) descarta o banco e os uploads. Os tempos de carga também variam: cerca de 5 a 10 segundos para um WordPress limpo, mas 30 a 60 segundos com um plugin grande como o WooCommerce. Para trabalho sério e persistente, é a CLI (ou a extensão do VS Code) que você quer — não a aba do navegador.

Links de Referência para Aprofundamento

Site oficial do WordPress Playground – Teste diretamente no navegador.
Documentação do Playground CLI (@wp-playground/cli) – Como instalar e rodar o WP no seu terminal via Node.js.
WordPress Blueprints API – Aprenda a criar receitas JSON para estruturar ambientes automaticamente.
Agent Skill wp-playground – Como instalar e usar a skill de agente para automatizar o Playground.
Connect AI Coding Agents to WordPress Playground with MCP – O anúncio oficial (março de 2026) sobre como conectar seu editor de código e IA ao WP usando o Model Context Protocol.