En esta lección · 5 min
Tres fuentes de contexto, modelo elegido y ejecución supervisada.
Fase 4 · Implementación
Studio Code conecta conversación y sitio
Abre el sitio local, entra en la pestaña Studio Code y trabaja con el agente dentro del proyecto.
Para llevar Del proyecto abierto a una implementación asistida
Notas del presentador
Haz una presentación breve: Studio Code es el agente de programación integrado en la aplicación WordPress Studio y también disponible en la CLI. En desktop, selecciona el sitio y abre la pestaña Studio Code; el agente pasa a trabajar en el directorio de ese proyecto. [Sources] https://developer.wordpress.com/docs/developer-tools/studio/studio-code/
Herramientas básicas
El agente trabaja con el sitio abierto
C
Chat
Recibe instrucciones, archivos y preguntas.
F
Archivos
Lee y edita el directorio del sitio.
W
WP-CLI
Ejecuta comandos en el WordPress local.
▣
Capturas
Abre y registra el resultado visual.
Notas del presentador
Muestra solo lo esencial de la interfaz: conversación, adjuntos, selector de modelo e historial de acciones. La documentación indica que el agente puede leer y escribir archivos, ejecutar WP-CLI y capturar el sitio. Las operaciones remotas quedan fuera de esta demostración. [Sources] https://developer.wordpress.com/docs/developer-tools/studio/studio-code/
Modelos disponibles · 05/08/2026
Elige el modelo para la tarea
S5
Claude Sonnet 5
La opción predeterminada, rápida y eficaz para la mayoría de las tareas.
O
Claude Opus 4.8
Más capaz para tareas complejas y con varias etapas.
G
GPT 5.6 Sol
Una opción OpenAI rápida y eficaz para tareas generales.
Notas del presentador
En desktop, usa el menú de la parte inferior de la conversación; en el terminal, usa /model. Explica que esta lista cambia rápidamente y debe comprobarse en el selector antes del evento. La documentación oficial verificada el 5 de agosto de 2026 enumera Sonnet 5 como predeterminado, Opus 4.8 y GPT 5.6 Sol. [Sources] https://developer.wordpress.com/docs/developer-tools/studio/studio-code/
Contexto de implementación
Tres fuentes guían al agente
Notas del presentador
Adjunta los dos archivos Markdown e indica la carpeta o los assets del Design System. Pide al agente que lea las tres fuentes, inspeccione el sitio actual, señale conflictos y proponga un plan breve antes de editar. La carga de archivos está disponible en desktop y en la CLI. [Sources] https://developer.wordpress.com/docs/developer-tools/studio/studio-code/
Plan aprobado
Contexto entregado. Agente en acción.
Autoriza la implementación por etapas; después revisa el diff y las capturas en desktop y mobile.
A continuación 05 · Site Editor
Notas del presentador
Cuando requirements.md, design.md y el Design System se hayan comprendido y el plan esté aprobado, deja que el agente ejecute. Continúa supervisando: revisa permisos, diff y resultado visual antes de seguir al Site Editor. Si Studio Code no está disponible, usa el sitio de fallback.