¡¡Juega con WordPress!! – PlayGround, el patio de juegos de WordPress

¿Piensas que instalar WordPress es complicado?, ¿necesitas probar un plugin o tema WordPress y no tienes dónde hacerlo?, ¿o quieres mostrar algo de WordPress a un cliente o colega?. Todo esto está solucionado gracias al patio de juegos de WordPress, o WordPress PlayGround.

¿Qué es WordPress PlayGround?

WordPress Playground hace que cualquier usuario, estudiante, desarrollador o contribuidor tenga una instalación de WordPress al instante.

Puedes hacer todo esto:

• Probar un tema, plugin o bloque.
• Crear una web completa, incluso guardarla para ti y alojarla donde quieras.
• Probar un plugin con varias versiones de WordPress y PHP.
• Incrustar un sitio WordPress completo,  y totalmente interactivo, en un curso o tutorial.
• Mostrar el funcionamiento de un plugin o tema en tu web.
• Previsualizar versiones en desarrollo desde el repositorio oficial.
• …or incluso ejecutar WordPress de manera local usando el  plugin para VisualStudio Code o una herramienta para CLI llamada wp-now

¿Cómo puedes probar WordPress PlayGround?

Es muy sencillo, solo tienes que visitar playground.wordpress.net y se instalará un WordPress al instante, pudiendo elegir el tipo de instalación, versión de WordPress y de PHP haciendo clic en la parte superior.

Los tipos de instalación por defecto son:

• Temporal- Desaparecerá si recargas la página.
• Persistente – La instalación se almacena en tu navegador. Elige esta opción y puedes borrar la instalación actual automática y lanzar una nueva.
• Directorio en directo desde tu ordenador – ¡Esto es tremendo! Eligiendo esta opción se sincroniza Playground con un directorio local. Tus archivos se mantienen privados y no se suben a ningún lado. Puedes seleccionar:
  • Directorio vacío : para guardar la instalación actual y comenzar a sincronizarla.
  • Directorio existente de Playground : para cargar ahí la instalación actual ahí y comenzar a sincronizarla.

  Los archivos modificados en Playground se sincronizarán en tu ordenador.
  Los archivos modificados en tu ordenador no se sincronizarán con Playground. Deberás hacer clic en el botón «Sincronizar archivos locales».

Una vez creado el sitio verás unos iconos de flecha arriba y abajo desde los que puedes descargar la instalación de tu WordPress PlayGround al ordenador o subir una instalación previa.

Para volver a acceder a tu instalación local, personalizada, de WordPress PlayGround, la próxima vez debes acceder con este URL:

https://playground.wordpress.net/?storage=opfs-host

¿Cómo funciona WordPress PlayGround?

Aunque te sorprenda, funciona igual que cualquier WordPress al que estás acostumbrado, ¡es todo igualito! Bueno, no del todo, faltan algunas cosas…

• No puedes cambiar de idioma 🙁
• No hay servidor de correo, no envía emails.
• No hay instalador de plugins automático (todavía) pero puedes subirlos manualmente desde el instalador de plugins.
• No hay instalador de temas automático (todavía) pero puedes subirlos manualmente desde el instalador de temas.
• No hay editor de archivos de plugins, aunque sí puedes usar el editor del sitio.
• Está pensado principalmente para temas de bloques, no funciona el personalizador aunque instales un tema clásico.

Hechas estas salvedades, todo lo demás funciona perfectamente.

WordPress PlayGround nivel experto

¿Quiere más? Hay un montón de cosas que puedes hacer con WordPress PlayGround, y estos son solo algunos ejemplos…

Instalar WordPress PlayGround con versiones concretas de WordPress y PHP

Si quieres lanzar una instalación personalizada con una versión de WordPress y PHP específica, sin perder tiempo, puedes hacerlo lanzando WordPress PlayGround con parámetros en la URL, que indiquen la versión de WordPress y PHP deseada, por ejemplo:

https://playground.wordpress.net/?php=8.2&wp=6.2

Ejecutar WordPress PlayGround a ventana completa del navegador

Si prefieres ver que el patio de juegos de WordPress ocupe toda la ventana de tu navegador, como cualquier otro WordPress, solo tienes que acceder a WordPress PlayGround con esta URL:

https://playground.wordpress.net/?mode=seamless

Y se mostrará como estás acostumbrado…

Incrustar WordPress PlayGround en tu web

Si quieres insertar en una página o entrada de tu web una instancia del patio de juegos de WordPress solo tienes que incrustarlo como un iframe, así:

<iframe src="https://playground.wordpress.net/"></iframe>

Incrustar WordPress PlayGround con cualquier tema o plugin de WordPress.org

Otra posibilidad es mostrar el patio de juegos con algún plugin o tema concreto instalado y activo, por ejemplo:

<iframe src="https://playground.wordpress.net/?plugin=coblocks"></iframe>

<iframe src="https://playground.wordpress.net/?theme=pendant"></iframe>

Incrustar WordPress PlayGround con cualquier tema o plugin

Si el tema o plugin no está en el directorio oficial de WordPress puedes igualmente incrustar el patio de juegos, con un poco más de código, mediante BluePrints, así:

{
"steps": [
{
"step": "installPlugin",
"pluginZipFile": {
"resource": "url",
"url": "https://tu-sitio.com/your-plugin.zip"
}
},
{
"step": "installTheme",
"pluginZipFile": {
"resource": "url",
"url": "https://tu-sitio.com/your-theme.zip"
}
},
{
"step": "importFile",
"pluginZipFile": {
"resource": "url",
"url": "https://tu-sitio.com/starter-content.wxz"
}
}
]
}

Incrustar WordPress PlayGround con versiones de desarrollo o antiguas

Otra posibilidad, para entornos de pruebas, es incrustar el patio de juegos con versiones específicas de WordPress y PHP, de este modo:

<iframe src="https://playground.wordpress.net/?php=7.3&wp=5.9"></iframe>

Combinando un poco de todo para un patio de juegos WordPress personalizado

Ahora supón que quieres incrustar WordPress PlayGround con un montón de ajustes por defecto, como esto:

<iframe src="https://playground.wordpress.net/?plugin=spectra&theme=pendant&url=/wp-admin/post-new.php&mode=seamless"> </iframe>

Con este iframe se lanzará así:

• Plugin Spectra instalado y activo.
• Tema Pendant instalado y activo.
• Ventana del editor de entradas → Nueva entrada.

Ejecutar código PHP en el navegador

Y, no por último, pero sí en lo que se refiere a estos ejemplos, puedes ejecutar código PHP de manera incrustada, por ejemplo:

<iframe id="wp"></iframe>
<script type="module">
const client = await startPlaygroundWeb({
iframe: document.getElementById('wp'),
remoteUrl: 'https://playground.wordpress.net/remote.html',
});
await client.isReady;
await client.run({
code: `<?php
require("/wordpress/wp-load.php");

update_option("blogname", "¡PlayGround mola!");
echo "Patio de juegos de WordPress";
`,
});
client.goTo('/');
</script>

¿Cómo es que funciona WordPress PlayGround sin base de datos ni almacenamiento?

WordPress necesita muchas partes en movimiento incluso para arrancar. En primer lugar, un servidor, pero también una base de datos para su arquitectura PHP.

Sin embargo, ¿qué pasaría si no necesitaras una implementación típica de ninguno de estos elementos para poner en marcha una nueva instalación de WordPress? Aquí es donde entra WordPress PlayGround.

Se trata de una versión de la plataforma totalmente integrada en el navegador que no necesita servidor, PHP ni base de datos. En su lugar, utiliza otras tecnologías muy utilizadas para simular o sustituir los componentes estándar necesarios:

• Utiliza un binario de WebAssembly para crear un intérprete de PHP.
• En vez de MySQL, hay un plugin WordPress que ejecuta SQLite.
• El servidor web usar una implementación personalizada de JavaScript.

Con todo esto, tienes una instalación nueva de WordPress que se ejecuta en el navegador, sin las habituales dependencias, o al menos no todas.

¿Qué otros usos tiene WordPress PlayGround?

Hay muchísimas posibilidades, además de las que hemos visto en este artículo, pero de momento ya está en marcha la plataforma de traducciones en directo integradas en WordPress, que ya vimos.

Y en la página del proyecto hay varias implementaciones a futuro, como el uso de WP-CLI y mucho más.

¡Nos vemos en el patio de juegos de WordPress!

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!