Strapi 5 CMS
Ajustes Globales — Controla tu Tienda sin Tocar Código
El panel Storefront Setting en Strapi te permite configurar la identidad visual de la tienda y sincronizarla en tiempo real con el frontend de Next.js.
Identidad de Marca y Navegación
Para personalizar la apariencia del escaparate, accede a Storefront Setting en Single Types.
- Conversión de Precios (convertToToman): Ajusta la visualización de precios según la moneda local seleccionada.
- Orientación RTL (isRtl): Habilita la dirección de derecha a izquierda para idiomas como árabe y persa.
- Estilos Dinámicos (Dynamic Styling): Modifica los colores de marca, tipografías y enlaces sociales en vivo.
🌐 Menú Principal del Sitio (Header Settings)
Estilo del Menú (headerStyle):
Pantalla completa
🌐 Pie de Página Principal (Footer Settings)
Estilo del Pie (footerStyle):
Pantalla completa
🧩 Estilos de Cabecera de Sección (Section Headers)
Pantalla completa
🎨 Paletas de Colores de Tema (Theme Palettes)
Recomendación de Contraste:
Para preservar la legibilidad y la identidad de marca, opta por combinaciones con alto contraste.
- Soporte fluido para alternancia entre modo claro y oscuro.
- Las variables de CSS se propagan automáticamente a todos los botones y enlaces.
- Prueba los cambios en vivo en tu entorno local antes de publicarlos en producción.
Paleta Modo Claro (Light Mode):
Modo Claro por Defecto (Slate)hsl(0 0% 100%)
Fondo
#FFFFFF
Primario
#171717
Secundario
#F5F5F5
Acento
#F5F5F5
Paleta Modo Oscuro (Dark Mode):
Modo Oscuro por Defecto (Zinc)hsl(0 0% 3.9%)
Fondo
#0A0A0A
Primario
#FAFAFA
Secundario
#262626
Acento
#262626
📄 Diseños de Páginas Internas (Inner Pages)
Estilo de la Ficha de Producto:
Pantalla completa
Estilo del Catálogo General:
Pantalla completa
Estilo de la Página del Carrito:
Pantalla completa
Estilo de la Pasarela de Pago:
Pantalla completa
Estilo de Confirmación de Pedido:
Pantalla completa
👤 Páginas del Área de Cliente (Account Pages)
Estilo de la Pantalla de Login:
Pantalla completa
Estilo del Perfil de Usuario:
Pantalla completa
🎛️ Componentes Globales de UI (Shared UI)
Patrón de Fondo Global (Global Background):
Pantalla completa
Barra de Navegación Inferior para Móviles (Mobile Bottom Navigation):
Pantalla completa
Sincronización Inmediata:
Cualquier modificación en los ajustes globales se refleja al instante en el escaparate gracias a la revalidación automática.
Catálogo de Bloques Modulares
Explora todos los bloques disponibles y examina sus opciones de maquetación.