La Tienda Pública convierte el inventario que ya está en Axentra en un catálogo en línea con la marca de su negocio. Sus clientes acceden por un enlace tipo su-empresa.axentra.com.do/tienda, ven los productos que usted decida exponer (con foto, precio, existencia) y le escriben directamente por WhatsApp para comprar. Sin carrito, sin pagos en línea, sin pasarelas — pensado para el flujo dominicano real: el cliente llega, pregunta, usted le confirma stock y precio, y cierran por chat.
Es gratis para todos los planes y se administra desde Configuración → Tienda Pública.
storefront.publish.)retail, restaurant o services. Cambia algunos comportamientos por defecto (un restaurante muestra el catálogo agrupado por categorías como menú, retail muestra grilla de tarjetas).+18095551234. Es el número al que se enlazan todos los botones "Comprar por WhatsApp".Tras guardar, la URL pública aparece arriba del switch. Cópiela y compártala por IG, Facebook, WhatsApp, o ponga el QR impreso en la caja.
Por defecto todo el inventario es privado. Usted decide producto por producto qué se ve en la tienda.
En el formulario, sección "Tienda Pública", marque la casilla "Visible en tienda pública". El estado se guarda con el resto de los datos del producto.
Importante: solo se publican productos que están a la vez activos (
is_active=true) y públicos (is_public=true). Desactivar un producto lo retira de la tienda inmediatamente, aunque siga marcado como público.
Configuración → Tienda Pública → Tema controla cómo se ve la tienda sin tocar código.
| Variable | Qué afecta |
|---|---|
| Color primario | Hero, encabezados de sección, hover de tarjetas, links activos |
| Color de acento | Botón "Ver catálogo", precios, badges de "en existencia" |
| Tipo de letra | Familia tipográfica de toda la tienda (Inter, Poppins, Nunito, Roboto) |
| Radio de bordes | Esquinas redondeadas en tarjetas, botones, inputs (slider 0–24 px) |
Los cambios se aplican al guardar; el navegador del cliente toma la nueva versión en la próxima visita (la hoja de estilos tiene caché de 5 minutos con revalidación por ETag).
Si elige un color primario muy claro (ej. un pastel azul), el sistema calcula automáticamente un color de texto legible para el hero (slate-oscuro sobre fondo claro, blanco sobre fondo oscuro), exponiendo la variable --storefront-on-primary. Esto evita el clásico problema de "texto blanco invisible sobre fondo claro" sin que usted tenga que pensarlo.
Para los negocios que tienen un diseñador o quieren un look único, Configuración → Tienda Pública → CSS personalizado abre un editor donde puede pegar CSS arbitrario que se inyecta al final de la hoja de estilos de su tienda.
:root { --storefront-primary: #38bdf8 } repinta todo lo que use esa variable.header, footer, body, main, a[href*="/producto/"], a[href^="https://wa.me/"], etc.@keyframes y animation funcionan.color-mix(), clamp(), :has(), gradientes, backdrop-filter, etc.@import url(...) se eliminan al guardar (puerta clásica para inyectar contenido externo).expression(...) (legado de IE) se eliminan.La hoja de estilos de su tienda se construye en este orden:
Como el CSS personalizado va al final, gana en el orden de cascada: cualquier variable que reasigne ahí sobreescribe la del paso 2.
Nota: el CSS personalizado solo aplica dentro de su tienda pública. No afecta al panel de administración ni a ninguna otra parte de Axentra.
/* Brand variables */
:root {
--storefront-primary: #38bdf8;
--storefront-on-primary: #0c1c2e;
--storefront-accent: #0f172a;
--storefront-radius: 16px;
--storefront-shadow-hover:
0 8px 28px rgba(14,165,233,0.18),
0 2px 6px rgba(15,23,42,0.06);
}
/* Body con sutil gradiente radial en las esquinas */
body {
background:
radial-gradient(ellipse at 0% 0%, rgba(56,189,248,0.08), transparent 40%),
radial-gradient(ellipse at 100% 100%, rgba(15,23,42,0.04), transparent 40%);
}
/* Header tipo "frosted glass" */
header {
backdrop-filter: saturate(140%) blur(8px);
background-color: rgba(255,255,255,0.78) !important;
}
/* Hero con gradiente diagonal */
main > section:first-of-type {
background-image:
linear-gradient(135deg,
var(--storefront-primary) 0%,
color-mix(in srgb, var(--storefront-primary) 75%, #6366f1) 100%) !important;
}
/* Subrayado de acento debajo de los títulos de sección */
main h2 { position: relative; padding-bottom: 8px; }
main h2::after {
content: '';
position: absolute; bottom: 0; left: 0;
width: 48px; height: 3px;
background: var(--storefront-primary);
border-radius: 2px;
}
/* Pulso suave en el botón de WhatsApp */
a[href^="https://wa.me/"] {
animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse {
0%,100% { box-shadow: 0 6px 20px rgba(37,211,102,0.35); }
50% { box-shadow: 0 8px 28px rgba(37,211,102,0.55); }
}
La tienda pública es una SPA mobile-first con tres vistas:
/tienda)/tienda/catalogo)/tienda/producto/<id>)SUM(stock_levels.quantity) > 0 en todos los almacenes en tiempo real)."Hola, quisiera comprar [Producto] (RD$1,200.00)".El embudo entero se basa en enlaces deep-link a WhatsApp:
https://wa.me/<numero-sin-mas>?text=<mensaje-codificado>
Esto es deliberado: el cliente dominicano promedio prefiere chatear antes que llenar un carrito. Y para usted, esa conversación de WhatsApp se convierte en una venta real con un par de mensajes.
Hay dos permisos distintos relacionados con la tienda:
| Permiso | Quién lo necesita | Qué permite |
|---|---|---|
config.update |
Quien edita la tienda | Editar slug, vertical, WhatsApp, tema, CSS personalizado, imágenes |
storefront.publish |
Quien activa/desactiva | Encender o apagar el switch principal de "tienda habilitada" |
Esta separación deja que un administrador pueda dar el permiso de publicar a un rol de marketing sin darle acceso al resto de la configuración de la empresa. Por defecto, ADMIN tiene ambos permisos.
Cada vez que se activa o desactiva la tienda se escribe un evento en el registro de auditoría (audit_logs) con quién hizo el cambio, cuándo, y los valores antes/después.
La tienda incluye:
La tienda vive bajo el dominio de su empresa en la plataforma:
https://su-empresa.axentra.com.do/tienda
En una próxima versión podrá usar un dominio personalizado (por ejemplo mitienda.com) apuntando a su tienda en Axentra.
Hoy la tienda no incluye:
Estos podrían venir en una v2 según demanda. La filosofía de v1 es "el camino más corto entre un producto en su inventario y una conversación de WhatsApp con el cliente".
Verifique en orden:
Los estilos se cachean unos minutos en el navegador del cliente. Si tiene la pestaña abierta desde antes del cambio, recargue con Cmd+Shift+R (Mac) o Ctrl+Shift+R (Windows) para forzar la actualización.
Asegúrese de que:
@import se eliminan automáticamente: si dependía de ellas, copie el contenido directamente en su CSS.+: +18095551234, no (809) 555-1234.