Wordpress

Migración desde Shopify

El objetivo era que Drip Universe dejara de depender de Shopify y pasara a tener una tienda propia en WordPress + WooCommerce, sin perder la estética ni la experiencia de compra que ya funcionaban.

Para la base visual elegí el tema Astra junto con Spectra. Es ligero, muy flexible y permite construir páginas complejas con el editor visual de WordPress sin pelearse con el código en cada cambio. En menos de una semana la tienda quedó replicada a nivel de diseño, lista para conectar con el nuevo motor de e-commerce.

El corazón de la tienda lo monté con WooCommerce + WooPayments, el estándar de facto en e-commerce sobre WordPress. Esto permitió:

• Configurar productos, variantes y stock de forma clara.
• Integrar pasarelas de pago habituales con buena documentación y soporte.
• Dejar la puerta abierta a futuras integraciones (cupones, membresías, automatizaciones, etc.).

Aunque Drip Universe está orientada principalmente a público hispanohablante, la marca quiere abrir mercado en Estados Unidos. Por eso configuré la tienda como sitio multidioma con TranslatePress, permitiendo mantener contenidos en español e inglés desde una misma instalación.

La migración del catálogo desde Shopify se completó con S2W (Shopify to WooCommerce), ajustando mapeos de campos y categorías para que la estructura de productos encajara con el nuevo modelo de datos de WooCommerce. Para las necesidades actuales bastó con la versión gratuita del plugin.

Para la puesta en producción opté por Hostinger, un hosting optimizado para WordPress con buen rendimiento por coste. Esto simplificó el despliegue y dejó a Drip Universe con una plataforma fácil de mantener, escalable y con control total sobre su tienda online.

A partir de ahí sigo dando soporte y mantenimiento sobre la instalación: pequeñas iteraciones, ajustes de rendimiento y desarrollo de plugins a medida como la barra de anuncios y el carrusel de imágenes y vídeos, que se detallan en las siguientes secciones.

Plugin Wordpress

Barra de anuncios

Desarrollé un plugin de barra de anuncios para WordPress que replica y mejora el comportamiento de un componente propio de Shopify: una franja fija en la parte superior de la web que muestra mensajes promocionales deslizándose horizontalmente de forma continua.

El objetivo era claro: que el equipo de Drip Universe pudiera gestionar sus mensajes sin depender de un desarrollador. Para ello, integré la barra como un bloque editable dentro del panel de WordPress, de modo que cualquier cambio se pueda hacer desde el propio escritorio de la tienda.

Desde el panel de edición, el usuario puede:

• Crear, editar, eliminar y reordenar los textos de la barra.
• Ajustar el color de fondo, el color del texto y la tipografía para que encajen con la identidad visual de la marca.
• Configurar la velocidad de deslizamiento y los márgenes para adaptar la barra al diseño de la página.

El resultado es una barra de anuncios ligera, responsive y 100% editable, que permite destacar promociones, envíos gratuitos o mensajes clave en toda la tienda sin tocar una línea de código.

Plugin Wordpress

Carrusel de imágenes y vídeos

Los carruseles incluidos en Astra y Spectra se quedaban cortos para lo que Drip Universe necesitaba. Hacía falta un carrusel responsive y a medida, capaz de combinar imágenes y vídeos, con enlaces por elemento y un alto nivel de personalización desde el propio WordPress.

El resultado fue un plugin de carrusel personalizado que se integra como bloque dentro del editor de WordPress. Igual que con la barra de anuncios, la idea es que el equipo pueda gestionar todo sin depender de un desarrollador.

Desde la interfaz del bloque se pueden configurar, entre otros, estos ajustes:

• Número de elementos visibles en móvil y en escritorio, de forma independiente.
• Espaciado entre diapositivas ajustable al píxel.
• Formato de las slides: automático, cuadrado o rectángulo 16:9.
• Mostrar u ocultar flechas y puntos de navegación.
• Activar loop, autoplay y ajustar la velocidad.
• Opacidad del caption y efectos hover para resaltar contenido.

Cada elemento del carrusel es totalmente editable:

• Asignar una URL y su target (misma pestaña o nueva ventana).
• Añadir un caption con texto, eligiendo tipo (overlay o barra), visibilidad (solo al hacer hover o siempre) y alineación.

El carrusel admite tanto imágenes como vídeos al mismo tiempo, manteniendo los controles nativos de reproducción. Implementa lazy load y un sistema de gestión de tiempos para reducir el impacto en la carga de la página y evitar saltos visuales. Si algo se desajusta, el propio editor permite refrescar fácilmente todos los assets.

En la práctica, este plugin permite a Drip Universe crear secciones de destaque muy ricas visualmente (lanzamientos, colecciones, campañas) sin renunciar al rendimiento ni a la flexibilidad.