La página de Diseño es tu centro neurálgico para marcar cada superficie orientada al cliente: proceso de pago, escaparate y portal del cliente. Los cambios se aplican instantáneamente en los tres y se muestran en vista previa en tiempo real antes de guardar.
Aspectos destacados
- Centro de diseño unificado: configura la apariencia del proceso de pago, escaparate y portal del cliente desde una sola página.
- Temas predefinidos: comienza con un tema seleccionado y personalízalo desde ahí.
- Modo claro y oscuro: define paletas de colores distintas para cada modo.
- Vista previa en vivo: observa cómo quedan los cambios en el proceso de pago, portal del cliente y escaparate antes de guardar.
- Anulaciones por sección: ajusta secciones individuales (proceso de pago, escaparate, portal del cliente) sin afectar a las demás.
- Control programático: anula temas durante el pago mediante la API o el Checkout SDK.
Primeros pasos
Navega a Configuración → Diseño en tu Panel de Control de Comerciante. La página de Diseño tiene cuatro pestañas:Ajustes generales
La pestaña General controla la identidad de marca base y el tema global.
Configuración básica
Ajustes avanzados
Expande Ajustes avanzados para acceder a controles detallados:
Tipografía
Configuración de colores
Define paletas de colores separadas para Modo claro y Modo oscuro. Cada modo admite las siguientes propiedades:Borde
Temas predefinidos
Dodo Payments incluye cuatro temas seleccionados. Selecciona uno desde el desplegable Tema en la pestaña General para aplicar instantáneamente un diseño coherente en el proceso de pago, escaparate y portal del cliente.Dodo Pulses
El tema predeterminado de Dodo Payments. Los acentos verde lima le dan una sensación enérgica y fresca. Tipografía sans-serif limpia con espaciado generoso.- Light Mode
- Dark Mode
Dodo Pulses in light mode
Terminal
Un tema orientado a desarrolladores con tipografía monoespaciada y acentos azul real. Esquinas pronunciadas y una estética técnica que combina bien con herramientas para desarrolladores y productos API-first.- Light Mode
- Dark Mode
Terminal in light mode
Bumblebee
Acentos cálidos ámbar y dorados con estilo moderno y redondeado. Audaz y de alto contraste, ideal para productos orientados al consumidor que buscan una apariencia premium.- Light Mode
- Dark Mode
Bumblebee in light mode
Bubblegum
Acentos juguetones en rosa y magenta con esquinas completamente redondeadas. Una estética moderna y accesible que funciona muy bien para herramientas creativas, productos de diseño y marcas de estilo de vida.- Light Mode
- Dark Mode
Bubblegum in light mode
Anulaciones por sección
Cada pestaña de sección (Proceso de pago, Escaparate, Portal del cliente) incluye un interruptor Anular tema. Cuando está activado, puedes personalizar la apariencia de esa sección independientemente del tema global.Pestaña Proceso de pago
- Información y precios del producto
- Opciones de pago express (Apple Pay, Google Pay)
- Selección de método de pago y formulario de tarjeta
- Código de descuento y desglose de precios
Pestaña Escaparate
Pestaña Portal del cliente
- Gestión de suscripciones
- Historial de facturación
- Métodos de pago
- Billetera y créditos
Recursos relacionados
Checkout Features
Funciones del proceso de pago, incluida la moneda, el idioma, los impuestos, los descuentos y más.
Overlay Checkout SDK
Incrusta el proceso de pago como una superposición modal en tu página.
Inline Checkout SDK
Incrusta el proceso de pago directamente en el diseño de tu página.
Storefront
Configura y administra tu escaparate con marca.
Customer Portal
Portal de autoservicio para clientes de suscripciones y facturación.
Multi-Brand Setup
Gestiona múltiples marcas bajo una sola cuenta con branding independiente.