Rupert Law Group — Migración completa de Divi a Elementor para un estudio de abogados de inmigración en EE.UU. con un plazo ajustado

El Desafío

Rupert Law Group es un estudio de abogados de inmigración en Estados Unidos que ayuda a sus clientes con visas de inversión E-1 y E-2. Su sitio web, construido sobre el tema Divi (v4.27.2), había funcionado bien durante años, pero empezaba a mostrar su antigüedad. Los tiempos de carga iban en aumento, el builder de Divi los ataba a un solo proveedor, y hasta los cambios de diseño más simples requerían soluciones parciales que se iban acumulando con el tiempo.

El estudio quería migrar a Elementor Pro con un child theme de Hello Elementor. El problema: necesitaban la migración terminada antes del 1 de abril de 2026. Eso nos dejaba aproximadamente dos semanas para auditar el sitio existente, construir un child theme completo desde cero, crear plantillas de Elementor listas para importar en cada página, y ejecutar un proceso de QA completo en staging antes de pasar a producción. Todo esto sin modificar la estructura de URLs, la configuración de SEO ni el contenido existente.

Nuestro Enfoque

Auditoría de diseño y mapeo de colores. Comenzamos con una auditoría visual completa del sitio Divi en producción, documentando cada valor de color, peso de fuente, regla de espaciado y patrón de componentes. Esto nos dio una hoja de referencia con siete colores de marca (azul marino #072F6C, dorado #EEE86D, beige #D7D1A9 y cuatro tonos de soporte), tres familias tipográficas (Roboto, Poppins, Open Sans) y medidas exactas para el header, footer, botones flotantes y popup de contacto.

Desarrollo del child theme. Con la auditoría como guía, construimos un child theme de Hello Elementor que contiene todos los estilos de marca como propiedades CSS personalizadas, una capa JavaScript completa para los botones flotantes de WhatsApp y contacto, un sistema de popup modal para el formulario de contacto (integración con Gravity Forms), comportamiento de header sticky, breakpoints responsive y estilos de impresión. El tema pasó por 43 versiones mientras ajustábamos detalles como posición de botones, estilo de campos de formulario y comportamiento en móvil.

Creación de plantillas Elementor. Produjimos 27 archivos de plantilla JSON cubriendo cada tipo de página: homepage, páginas de servicios (visa E-1, visa E-2 y todas las variantes por país), landing pages para campañas publicitarias, página de contacto, archivo de blog, layout de post individual, política de privacidad, resultados de búsqueda, header, footer y popup de contacto. Cada plantilla fue construida para igualar el diseño Divi existente, aprovechando los widgets nativos de Elementor.

Auditoría en staging y QA iterativo. Cada versión del child theme fue desplegada en un ambiente de staging y probada contra un checklist de más de 400 puntos que cubría precisión del layout, comportamiento responsive, funcionalidad de Gravity Forms, cumplimiento de accesibilidad (WCAG 2.1 AA) y renderizado cross-browser. Los problemas encontrados durante staging alimentaban directamente la siguiente iteración del tema, creando un ciclo cerrado de construcción, prueba y corrección.

Alcance y Cobertura del Proyecto

La migración abarcó:

• Un child theme de Hello Elementor completo (15 archivos, 180 KB) con propiedades CSS personalizadas, template parts PHP y JavaScript personalizado
• 27 plantillas JSON de importación para Elementor cubriendo todos los tipos de página, incluyendo homepage, páginas de servicio, landing pages, blog y páginas legales
• Estilización de Gravity Forms para dos variantes: el formulario de la página de contacto (Form ID 1) y el formulario del popup de contacto (Form ID 16)
• Botones de acción flotantes: un botón de WhatsApp (escritorio, esquina inferior izquierda) y un botón de contacto (todos los dispositivos, esquina inferior derecha) con comportamiento inteligente que abre un modal en escritorio y redirige a la página de contacto en móvil
• Un popup modal de contacto con overlay beige, caja de diálogo blanca, cierre con Escape y clic fuera del modal, y accesibilidad completa por teclado
• Layouts responsive probados en escritorio (1440px+), tablet (768-1024px) y móvil (320-767px)
• Dos auditorías formales en staging (en formato planilla) comparando el resultado de staging contra el sitio Divi en producción, página por página
• Paquete de documentación completo: guía de setup, checklist de migración (más de 400 ítems), referencia de variables CSS y manifiesto de archivos

Los Resultados

• 27 plantillas de Elementor entregadas como archivos JSON listos para importar, cubriendo cada página activa del sitio
• Un child theme listo para producción en versión 2.43, probado a través de más de 43 iteraciones en staging
• 2.174 líneas de código personalizado (PHP, CSS, JavaScript) sin dependencias externas más allá de Elementor y Gravity Forms
• Cumplimiento de accesibilidad WCAG 2.1 AA verificado en todas las plantillas
• Cero cambios en la estructura de URLs, preservando todo el SEO existente y las páginas indexadas
• Testing cross-browser completado para Chrome, Firefox, Safari y Edge
• Documentación completa (más de 3.000 líneas) cubriendo instalación, configuración, pasos de migración y resolución de problemas
• Proyecto entregado dentro del plazo del 1 de abril de 2026

Lo Que Aprendimos

Las migraciones de tema para estudios de abogados vienen con un tipo de presión particular: el sitio es una señal de confianza para potenciales clientes, y cualquier quiebre visual o caída durante el cambio puede afectar las tasas de conversión directamente. Trabajar con Rupert Law Group reforzó que migraciones como estas necesitan un enfoque estructurado de auditoría primero, en lugar de saltar directamente a la construcción.

El ciclo iterativo de staging resultó ser la parte más valiosa del proceso. Al desplegar cada nueva versión del child theme en staging y compararla contra el sitio en producción en una auditoría en planilla, detectamos docenas de pequeñas discrepancias (posición de botones, altura de campos de formulario, comportamiento del menú móvil) que habrían sido fáciles de pasar por alto en una migración de una sola pasada. Las 43 iteraciones pueden parecer muchas, pero cada una fue un ciclo enfocado de corrección y verificación que mantuvo el timeline general corto.