Panel de la cuenta de cliente — Flujo de trabajo consciente de B2B
Vertex incluye una suite completa de cuentas de cliente que se adapta automáticamente a quien tenga la sesión iniciada. Un comprador de compras B2B con condiciones NET-30 y un representante de ventas asignado ve un panel. Un cliente final B2C ve uno diferente. Un comprador de cuentas por pagar multi-ubicación ve una tercera variante con un selector de empresa. Todo desde el mismo tema — sin app, sin una segunda familia de plantillas, sin código personalizado.
Esta guía cubre todas las pantallas de cuenta de cliente en Vertex, cómo funciona el comportamiento consciente de B2B, el flujo de reposicionado rápido, la experiencia de comprador multi-ubicación y cómo personalizar cada pantalla en el editor de tema.
La cuenta de cliente de Vertex está construida sobre las nuevas cuentas de cliente de Shopify (la experiencia sin contraseña, alojada por Shopify, que B2B requiere) con el estilo del tema Vertex y secciones conscientes de B2B superpuestas. Obtiene la elegancia de un tema personalizado y la flexibilidad de editar cada sección como cualquier otra página.
Lo que incluye la suite de cuentas de cliente
| Pantalla | Lo que hace |
|---|---|
| Panel | La página de aterrizaje tras iniciar sesión. Consciente de B2B: muestra información de la empresa, condiciones de pago, tarjeta del representante de ventas y reposicionado rápido para compradores B2B. Muestra la lista de pedidos y el enlace a direcciones para clientes B2C. |
| Vista de un solo pedido | Encabezado del pedido (número, fecha, estado, total), líneas de producto con botones "Volver a pedir este artículo" por línea, botón "Volver a pedir todo" del pedido completo en la parte inferior, direcciones de envío y facturación, estado de cumplimiento. |
| Direcciones | Agregar, editar, eliminar y establecer direcciones predeterminadas. Campos conscientes del país con validación de estado/provincia. |
| Iniciar sesión | Email + contraseña + "¿Olvidó su contraseña?" + CTAs "Crear cuenta". |
| Crear cuenta | Nombre, apellido, email, contraseña. CTA opcional "Solicitar cuenta comercial" que dirige a la página de Solicitud de presupuesto. |
| Activar invitación | Activa una cuenta de cliente creada por el comerciante en el admin de Shopify. |
| Restablecer contraseña | Dos pasos (solicitar correo de restablecimiento, luego introducir nueva contraseña). |
Cada pantalla está rediseñada en el sistema de diseño Vertex — la escala de espaciado, escala tipográfica, escala de radio, escala de sombra, sistema de botones y sistema de inputs que impulsan el resto del storefront. Así que la cuenta de cliente no se siente como una app aparte — se ve y se comporta exactamente como el resto de su tienda.
Esta es la nueva experiencia de cuenta de cliente alojada por Shopify que ven los compradores B2B — con la marca del nombre de su tienda y la dirección de envío, con pestañas de historial de pedidos y perfil en la parte superior. La apariencia proviene directamente de Shopify, no del tema Vertex. La tarjeta del representante de ventas y los atajos de reposicionado rápido los añade Vertex por encima.
El panel consciente de B2B
El panel es la pieza central. Detecta si el cliente con sesión iniciada es un comprador B2B y renderiza uno de los dos diseños automáticamente.
Cómo funciona la detección
No hay app, ni configuración, ni conmutador. Vertex comprueba si el cliente con sesión iniciada está vinculado a una empresa en Shopify B2B. Si lo está, se renderiza el panel B2B. De lo contrario, se renderiza el panel B2C. Es totalmente nativo e instantáneo.
Diseño del panel B2B
Para un comprador B2B con sesión iniciada, el panel muestra:
1. Encabezado de bienvenida
- Hola, [nombre] — saludo amigable
- Nombre de la empresa — extraído del registro de empresa del comprador
- Distintivos de la empresa — NET-30 / NET-60 / NET-90 y Exento de impuestos
- Envío actual — resumen corto de la dirección de envío seleccionada actualmente por el comprador
2. Tarjeta del representante de ventas (variante completa)
Si ha rellenado los metafields del representante de ventas por empresa (vertex.rep_name / vertex.rep_email / vertex.rep_phone en Customers ▸ Companies ▸ [empresa] ▸ Metafields), el panel muestra una tarjeta completa del representante de ventas — más grande que la pastilla más pequeña del encabezado.
La tarjeta incluye:
- Nombre del representante (con un avatar de inicial)
- Email del representante (clic para enviar correo)
- Teléfono del representante (clic para llamar)
Consulte la guía de configuración de metafields para rellenarlos.
La tarjeta del representante de ventas utiliza los datos del representante que rellena para cada empresa. Todos los compradores asociados a la misma empresa ven al mismo representante.
3. Lista de reposicionado rápido
La funcionalidad B2B más apreciada. Muestra los últimos 5 pedidos del comprador con:
- Número de pedido y fecha
- Total y recuento de artículos
- Botón Volver a pedir todo (un clic — vuelve a añadir todas las líneas al carrito a precios actuales)
- Distintivo del estado del pedido (Cumplido / Parcial / No cumplido / Cancelado)
- Enlace a la vista completa del pedido individual
Sin necesidad de app — el reposicionado rápido viene integrado en Vertex.
Si una línea de producto del pedido original ya no está en el catálogo del comprador, el reposicionado la omite y muestra una pequeña nota: "2 artículos del pedido #1234 ya no están disponibles y se omitieron." Los compradores aún pueden revisar el carrito antes del checkout.
4. Cuadrícula de enlaces rápidos
Una cuadrícula de las acciones canónicas de la cuenta B2B:
- Todos los pedidos — historial completo de pedidos
- Direcciones — gestionar direcciones de envío
- Pedido por volumen — enlace a la página de pedido por volumen (paste-to-cart)
- Solicitar un presupuesto — enlace a la página RFQ
- Catálogo — enlace al storefront filtrado por su catálogo B2B
5. Actividad reciente
Una línea de tiempo condensada de las últimas 10 acciones del comprador:
- Pedidos realizados
- Direcciones añadidas o actualizadas
- Solicitudes de presupuesto enviadas
Diseño del panel B2C
Para un cliente no B2B, el panel es más simple:
- Encabezado de bienvenida (sin información de la empresa, sin distintivo de condiciones de pago)
- Lista de pedidos (paginación completa)
- Tarjeta de Dirección predeterminada con enlaces de edición y gestión
- Sin tarjeta del representante de ventas (los clientes B2C no obtienen un representante asignado)
- Sin lista de reposicionado rápido (un único CTA "Ver pedidos" — los compradores vuelven a pedir desde la vista de pedido individual)
El panel B2C está diseñado a propósito para ser rápido y despejado — la mayoría de los clientes B2C quieren verificar el estado de un pedido, no interactuar con el chrome de la empresa.
Flujo de reposicionado rápido
El reposicionado rápido está disponible en dos superficies:
Superficie 1 — Lista de últimos 5 pedidos del panel
(Descrito arriba.) Un clic "Volver a pedir todo" por pedido, mostrando los 5 más recientes. A los compradores que vuelven a pedir el mismo kit semanalmente les encanta esto — son dos clics desde el inicio de sesión hasta un carrito completamente cargado.
Superficie 2 — Vista de pedido individual
Para pedidos más antiguos o para volver a pedir solo un subconjunto, la vista de pedido individual muestra:
- Botón "Volver a pedir este artículo" por línea en cada línea — añade una variante con la cantidad original
- Entrada de cantidad por línea para que el comprador pueda cambiar la cantidad antes de añadir (por defecto a la cantidad original del pedido)
- Botón "Volver a pedir todos los artículos" del pedido completo en la parte inferior — añade todas las líneas con la cantidad original
El mismo comportamiento de artículos omitidos que el reposicionado del panel, solo que con mayor granularidad.
Los reposicionados utilizan el precio actual del catálogo del comprador — no el precio histórico del pedido. Esto es importante para B2B: los precios contratados cambian, y volver a pedir a un precio antiguo entraría en conflicto con el nuevo catálogo. Si un comprador necesita que se respete el precio antiguo, debe contactar con su representante de ventas y enviar un presupuesto.
Compradores multi-ubicación
Algunos compradores B2B están asociados a varias empresas (p. ej., un gestor de cuentas por pagar corporativo que realiza pedidos para 5 filiales). Para estos compradores, Vertex muestra automáticamente un selector de empresa en el pie del cajón móvil y en la barra de bienvenida de escritorio.
Dónde se renderiza el selector
- Escritorio (≥1170px) — en la barra ámbar de bienvenida B2B (parte superior del encabezado) cuando hay más de una empresa disponible
- Móvil y tablet (<1170px) — en la parte inferior del pie del cajón hamburguesa, encima de las pastillas de idioma y divisa
Los compradores de una sola empresa no lo ven — UI limpia. El selector es totalmente accesible por teclado y coincide con cualquier otro desplegable en Vertex.
Cómo funciona el cambio
Cuando el comprador elige una empresa-ubicación diferente, Shopify recarga la página con la nueva empresa en sesión. Catálogo, precios, condiciones de pago, dirección de envío y estado de exención fiscal cambian todos a la nueva empresa. El carrito se conserva si es compatible, o se vacía con una advertencia si no lo es. Todo nativo — sin app, sin sincronización manual.
Iniciar sesión, crear cuenta, activar, restablecer contraseña
Todas las pantallas de autenticación se rediseñaron en el sistema de diseño Vertex. Comparten un lenguaje visual coherente:
- Diseño de tarjeta centrada con la fuente de encabezado y la fuente de cuerpo del storefront
- Logo y titular pequeño en la parte superior de la tarjeta
- Formulario de una columna con inputs de ancho completo (objetivos táctiles de 52 px, anillo de enfoque visible, etiqueta encima)
- Botón CTA principal en el color de acento del storefront
- Enlaces secundarios debajo — "¿Olvidó su contraseña?", "Crear cuenta", "¿Ya tiene cuenta?"
- Pie de página del storefront debajo de la tarjeta (ligero — solo enlaces legales y copyright)
Pantalla de inicio de sesión
- Email y contraseña
- Enlace "¿Olvidó su contraseña?"
- CTA "Crear cuenta"
- (Adición B2B) — nota pequeña: "¿Necesita una cuenta comercial? Solicitar acceso →"
Pantalla de crear cuenta
- Nombre, apellido, email, contraseña
- CTA "Crear cuenta"
- (Adición B2B) — nota pequeña: "¿Cliente comercial existente? Iniciar sesión →"
Comportamiento estándar de Shopify: las cuentas nuevas pasan por verificación por email antes de poder iniciar sesión. Las nuevas cuentas B2B son creadas por el comerciante a través de Customers ▸ Companies — no se autorregistran.
Pantalla de activar cuenta
Para clientes invitados por el comerciante. Aterrizan en esta página desde el correo de invitación y establecen su contraseña.
Pantalla de restablecer contraseña
Dos pantallas en una:
- Solicitar restablecimiento — input de solo email + CTA "Enviar enlace de restablecimiento"
- Establecer nueva contraseña — nueva contraseña + confirmar contraseña + CTA "Actualizar contraseña" (después de hacer clic en el enlace del email)
Personalización en el editor de tema
Las pantallas de cuenta de cliente son editables en el editor de tema, donde Vertex expone un pequeño conjunto de ajustes de sección. La personalización aquí es intencionadamente acotada — la estructura del panel es fija, y los controles de abajo son los que Vertex proporciona.
Abrir el panel en el editor de tema
- Abra Online Store ▸ Themes ▸ Customize
- En el desplegable de plantillas superior, elija Customers ▸ Account
- El editor de tema ahora renderiza el panel de cuenta con la sección Account en la barra lateral izquierda
La sección Account mantiene la personalización deliberadamente pequeña — hay exactamente dos ajustes, ambos bajo el encabezado Layout de la sección:
| Personalizar | Cómo |
|---|---|
| Recent orders to show | Ajustes de sección → "Recent orders to show" → controla cuántos pedidos recientes muestra la lista de reposicionado rápido. Rango 3–10, por defecto 5. |
| Show Quick actions card | Ajustes de sección → "Show Quick actions card" → activa o desactiva la tarjeta de acciones rápidas (por defecto activado). |
| Visibilidad de la tarjeta del representante de ventas | Automático — la tarjeta se muestra cuando el metafield vertex.rep_name de la empresa está rellenado y el comprador tiene la sesión iniciada; se oculta para clientes B2C y en modo Solo B2C. No hay conmutador por sección. |
El panel de Vertex se renderiza dentro de la experiencia de nuevas cuentas de cliente de Shopify. El saludo de bienvenida, las pestañas de pedidos y perfil, y el chrome general de la página provienen directamente de Shopify — la marca (nombre de la tienda, logo, colores) se edita en Settings ▸ Customer accounts en el admin de Shopify, no en esta sección. Los dos ajustes de arriba son los únicos controles a nivel de tema que Vertex superpone.
Para la vista de pedido individual (la sección Order), hay un ajuste:
| Personalizar | Cómo |
|---|---|
| Show print invoice link | Ajustes de sección → "Show print invoice link" → activa o desactiva el enlace de imprimir factura en la página de detalle del pedido (por defecto activado). |
Lectura relacionada
- Visión general — Por qué la cuenta de cliente de Vertex es consciente de B2B
- Instalación — Las plantillas de cuenta de cliente se incluyen habilitadas
- Guía de configuración B2B — Crear empresas, ubicaciones de envío, condiciones de pago
- Guía de configuración de metafields — Dónde rellenar los metafields del representante de ventas que impulsan la tarjeta del representante
- Guía de modos Storefront — Cómo interactúan Hybrid / B2B-only / B2C-only con el panel
- Markets y multidivisa — Cómo se renderiza la divisa en la cuenta de cliente
- Guía de la página RFQ — El CTA "Solicitar cuenta comercial" en la pantalla de registro
- Referencia de ajustes del tema — Ajustes relacionados con la cuenta
- Preguntas frecuentes y resolución de problemas — Preguntas comunes sobre cuentas
Resumen
- La suite de cuentas de cliente de Vertex es consciente de B2B — mismas pantallas, dos diseños, autodetectados.
- El panel B2B muestra información de la empresa, distintivo de condiciones de pago, tarjeta completa del representante de ventas, últimos 5 pedidos con reposicionado rápido y una cuadrícula de enlaces rápidos.
- El panel B2C está diseñado a propósito para ser rápido — solo pedidos y dirección predeterminada.
- El reposicionado rápido funciona desde el panel Y desde la vista de pedido individual — sin necesidad de app.
- Los compradores multi-empresa obtienen un selector de empresa en el pie del cajón móvil y en la barra de bienvenida de escritorio.
- Las pantallas de inicio de sesión, crear cuenta, activar y restablecer contraseña rediseñadas en el sistema de diseño Vertex.
- La sección Account expone dos ajustes de tema (recuento de pedidos recientes y la tarjeta de Quick actions); la sección Order añade un conmutador de imprimir factura.