Saltar al contenido

Marca blanca, Brand Experience y temas

Configura nombre comercial, logos, login del portal, colores y tipografía; publica y restaura versiones.

10 min de lectura

Personaliza la imagen del sistema con tu marca sin tocar código. Son tres pantallas que trabajan juntas:

  • White Label: identidad, dominios, contacto, redes, logos y assets.
  • Brand Experience: identidad corporativa ampliada (RNC, sitio web), experiencia de login y media.
  • Theme Engine: colores, tipografía, bordes, sombras y CSS del sistema.

Antes de empezar:

  • Permisos enterprise_whitelabel_access, enterprise_brand_access y/o enterprise_theme_access (o enterprise_platform_admin).
  • Para guardar, publicar o restaurar necesitas además los permisos *_manage, *_publish y *_rollback del módulo.

1. Abrir el módulo

Menú lateral Enterprise → White Label → /enterprise/white-label.

Desde ahí tienes botones a Theme Engine (/enterprise/theme). Brand Experience está en Enterprise → Brand Experience → /enterprise/brand.

Vista: Marca blanca, Brand Experience y temas

Vista: Marca blanca, Brand Experience y temas

Importante: El grupo Enterprise aparece en los diseños de menú vertical/combinado. Si usas el menú horizontal, entra escribiendo la URL.

Arriba a la derecha verás el estado: Borrador · vN o Publicado · vN con la fecha.

Vista: Marca blanca, Brand Experience y temas

2. Datos de la marca (White Label)

Completa las secciones y pulsa Guardar White Label:

Sección Campos
Identidad Nombre comercial, Razón social, Nombre corto (máx. 64), Slogan, Footer, Copyright
Dominios y portales Dominio, Subdominio, URL principal, Portal cliente, Portal técnico, Portal empresa (las URL deben ser completas, con https://)
Contacto Correo soporte, Correo ventas, WhatsApp, Teléfono
Redes sociales Facebook, Instagram, TikTok, YouTube, LinkedIn, X (URL completa)

Marca Sincronizar nombre comercial con la empresa si quieres que el nombre comercial también se actualice en los datos de la empresa.

3. Logos y assets

En Asset Manager — Logos cada tarjeta tiene su propio Subir: Logo principal, Logo horizontal, Logo oscuro, Logo claro, Logo impresión, Logo APP, Favicon, App Icon y Splash.

  • Formatos: PNG, JPG, WEBP, GIF, SVG o ICO.
  • Tamaño máximo: 5 MB por archivo.

En Brand Assets puedes subir otras imágenes eligiendo Categoría (Imágenes, Fondos, Íconos, Brand Assets) y Nombre. Cada asset guarda versiones: usa Historial para verlas y Rollback para volver a una (te pide el número de versión).

4. Brand Experience y login

En /enterprise/brand completa:

Bloque Campos
Identidad corporativa Nombre comercial, Razón social, Nombre corto, RNC, Slogan, Sitio web, Información legal
Contacto Teléfono, WhatsApp, Correos, Redes sociales
Experiencia de login Mensaje de bienvenida, Mensaje del loader, URL de video, Animaciones en login, Avisos / noticias (una línea por aviso)

Pulsa Guardar Brand Experience. En Media / assets de marca hay además fondos de login y portales, marca de agua, firma digital, sello y QR corporativo.

Consejo: El mensaje de bienvenida se usa como título del Portal del Cliente cuando en Ajustes → Cliente → Portal Cliente no hay un título propio.

Email branding es solo lectura: muestra cómo quedan nombre, logo, footer y colores en los correos.

5. Crear y editar un tema

  1. En Theme Engine, bloque Crear tema: escribe Nombre, elige Modo (Light, Dark, Auto) y, si aplica, Marcar como default.
  2. Pulsa Crear y abrir editor.
  3. En el editor ajusta Tipografía, Tamaño, Radius, Sombras, Animaciones, Loader, Spacing, Cursor, Iconografía y los 15 Colores (Primario, Secundario, Sidebar, Navbar, Botones, Texto, Success, Danger, etc.).
  4. La vista previa se actualiza sola. Cambia entre Desktop / Tablet / Mobile y Light / Dark / Auto.
  5. Revisa el cuadro Validación WCAG: si queda en rojo, el contraste no es suficiente.
  6. Pulsa Guardar borrador.

Otros botones: Duplicar, Exportar (descarga JSON) e Importar JSON en la pantalla principal.

6. Publicar

  • White Label y Brand Experience: botón verde Publicar arriba a la derecha.
  • Tema: Publicar en el editor (guarda el borrador y publica).

Importante: Un tema no se publica si la validación de contraste falla; el sistema muestra el motivo. Corrige los colores y vuelve a intentarlo.

7. Comparar y revertir

  • White Label / Brand Experience: en Versiones elige Versión A y Versión B → Comparar. Para volver atrás pulsa Rollback en la fila; el perfil queda como borrador y debes Publicar otra vez.
  • Tema: en Historial / Rollback del editor pulsa Rollback en la versión deseada. Comparar temas muestra las diferencias entre dos temas.

8. Checklist rápido

  1. Enterprise → White Label: identidad, contacto y redes → Guardar
  2. Subir logo principal, favicon y logo oscuro
  3. Brand Experience: RNC, login y avisos → Guardar
  4. Theme Engine: crear tema, colores con WCAG en verde → Guardar borrador
  5. Publicar tema, White Label y Brand Experience
  6. Si algo sale mal: Rollback y volver a publicar