Mi Giro Saludable Theme – Documentación Técnica
Versión: 1.5.1
Sitio: migirosaludable.com
Estructura del Homepage
1. Hero Slider
- Archivo:
template-parts/hero-slider.php - Slider principal con imágenes y texto promocional
- Navegación con flechas e indicadores
2. Benefits Section (Beneficios)
- Archivo:
template-parts/benefits-section.php - Fondo animado Spline 3D (glasswave)
- 4 badges: Natural, Rápido, Casero, Premium
- Timeline con pasos del proceso
3. Categories Section (Categorías)
- Archivo:
template-parts/categories-section.php - Grid de categorías con animated beams
- Cards con hover effects
4. Products Section (Productos)
- Archivo:
template-parts/products-section.php - Grid de 8 productos recientes
- Cards con imagen, precio y botón añadir
5. Blog Section
- Archivo:
template-parts/blog-section.php - Masonry grid con alturas variadas
- Image cards con overlay
Header
- Logo dual (claro/oscuro) con cambio automático
- Toggle de tema claro/oscuro
- Header fijo con efecto scroll
- Menú hamburguesa en móvil
Tamaños de Logo:
- Desktop: 140px altura
- Móvil: 90px altura
- Scroll: 80px altura
Footer
- Fondo con animación Spline 3D
- Grid de 4 columnas
- Logo, descripción, redes sociales
- Categorías de productos
- Enlaces rápidos
- Contacto + Newsletter
- Copyright y enlaces legales
Paleta de Colores
| Color | Hex | Uso |
|---|---|---|
| Negro | #000000 | Fondos, textos, botones |
| Blanco | #FFFFFF | Fondos claros, textos invertidos |
| Gris Oscuro | #333333 | Hover states |
| Gris Claro | #F8F8F8 | Fondos secundarios |
Tipografía
- Headings: Barlow Condensed (400, 600, 700)
- Body: Nunito Sans (400, 600, 700)
- Iconos: Font Awesome 6.5.1
WooCommerce
Páginas estilizadas:
- Producto Individual: Layout 2 columnas
- Tienda/Archivo: Grid responsive
- Carrito: Tabla estilizada
- Checkout: Formulario 2 columnas
- Mi Cuenta: Navegación lateral
Categorías creadas:
- Arroces y Fideuás
- Guisos
- Adobos
- Carnes
- Pescados y Mariscos
- Hamburguesas
- Rellenos
- Sazonadores
Responsive Breakpoints
| Breakpoint | Descripción |
|---|---|
| 992px | Tablet landscape |
| 768px | Tablet portrait |
| 576px | Móvil grande |
| 480px | Móvil pequeño |
Personalización (Customizer)
Opciones disponibles en Apariencia > Personalizar:
- Logo claro (migiro_logo_light)
- Logo oscuro (migiro_logo_dark)
- Información de contacto: Dirección, Teléfono, Email
Productos Creados: 23
Artículos del Blog: 7
Documentación actualizada: Diciembre 2025