Skip to content

Bloque 3D integrando Three.js en Gutenberg para WordPress

Publicado el · Joaquín Dati

Este proyecto consiste en el desarrollo de un bloque personalizado para el editor Gutenberg de WordPress, que permite incrustar y visualizar modelos 3D interactivos directamente en páginas o entradas, utilizando la biblioteca JavaScript Three.js.

Características principales:

  • Visualización 3D interactiva: Soporte para archivos .glb o .gltf que pueden rotarse, hacer zoom y desplazarse con el mouse o táctil.
  • Bloque 100% Gutenberg: Creado con React y las APIs de bloques de WordPress para integrarse de forma nativa en el editor visual.
  • Carga y previsualización en tiempo real: Permite al usuario cargar un modelo 3D desde el panel del bloque y visualizarlo instantáneamente en el editor.
  • Parámetros configurables: Opciones dentro del bloque para controlar el tamaño del canvas, luces, fondo, animaciones y cámara.
  • Optimizado para rendimiento: Uso eficiente de recursos para garantizar carga rápida y fluidez incluso en dispositivos móviles.
  • Extensible: Preparado para futuras mejoras como múltiples vistas, interacciones personalizadas o integración con ACF.

Este bloque está pensado para sitios que requieren mostrar productos, maquetas, diseños o contenido visual en 3D de forma profesional y atractiva, todo sin salir del entorno de WordPress.