Kowal Hyva Colors — los colores de la tienda bajo control

Panel y permisos

El módulo se abre desde kowal.store → Modules → Hyva Colors. La configuración se realiza en sus tres vistas, no en una sección independiente de Stores → Configuration.

El administrador asigna permisos en System → Permissions → User Roles. Concede a los roles los recursos de menú superiores de Kowal adecuados y los recursos de Hyva Colors:

Una importación que contenga nuevas definiciones de catálogo también requiere el permiso para añadir elementos. Tras cambiar un rol, puede ser necesario que el usuario vuelva a iniciar sesión.

Alcance de la tienda

Durante la publicación, seleccionas un único store view activo. El módulo comprueba el tema asignado: el perfil actual admite exactamente Hyva/default con Default Theme 1.5.2–1.5.x. No asignes otro tema solo para omitir la validación — los temas hijo necesitan una preparación independiente de los mapeos.

Un conjunto es un borrador reutilizable. Puedes publicarlo por separado para varias vistas. En esta versión no existe configuración heredada a nivel default/website/store.

Conjuntos del sistema y propios

Las definiciones preparadas incluyen siete paletas y un conjunto nativo vacío. Sus copias guardadas están disponibles en «Mis conjuntos». Lo más cómodo es crear conjuntos propios a partir de ellas — de este modo, los originales permanecen como punto de referencia.

Editor de colores

El editor divide el catálogo en secciones: Global, Header, Buttons, Product cards y Catalog and product page. Los nombres pueden permanecer en inglés. El catálogo inicial contiene 34 elementos y 99 mapeos. Un elemento individual puede tener entradas separadas para fondo, texto, borde y estados de interacción.

Formas disponibles de establecer valores:

native no inserta CSS inherit. El valor transparent es un color transparente explícito, no una vuelta al tema. También puedes usar currentColor. Las funciones CSS arbitrarias, como rgb() o var(), no se aceptan en los campos de color.

Guarda el borrador antes de cambiar de sección o de página del editor. Guardar no publica los cambios.

Colores compartidos: tokens

En «Paleta — ajustes avanzados (JSON)» se almacenan los colores con nombre. Ejemplo de fragmento:

{ 'brand': {'mode': 'color', 'value': '#1d4ed8'}, 'on-brand': {'mode': 'color', 'value': '#ffffff'}}

En la fila del elemento, selecciona «Color de la paleta» e introduce brand. Cambiar el token actualiza todos los valores que hacen referencia a él en la siguiente publicación. Si editas un conjunto preparado, conserva los demás tokens existentes — sustituir todo el JSON por el fragmento anterior puede dejar referencias sin resolver. Los ciclos y los tokens ausentes se rechazan.

Adición de elementos y secciones

No requiere modificar los archivos del módulo, pero sí identificar el selector CSS correcto. El módulo no dispone de un inspector visual de elementos.

1. Abre el editor de cualquier conjunto.
2. Despliega «Añadir elemento propio — modo avanzado».
3. Introduce un nombre, por ejemplo «Banner promocional».
4. Selecciona un nombre de sección existente o introduce uno nuevo, por ejemplo «Promociones».
5. Introduce un selector estable, por ejemplo #promo-banner, que exista en la tienda.
6. Selecciona propiedades, por ejemplo background-color, color, border-color.
7. Selecciona estados, por ejemplo normal y hover, y luego añade el elemento.
8. Abre la sección correspondiente, asigna colores, guarda y publica el conjunto.

La definición se añade al catálogo compartido; añadirla por sí sola no establece colores en todos los conjuntos. El selector debe ser lo más preciso posible. En esta versión no se admiten listas de selectores, :has() ni declaraciones CSS arbitrarias. Añadir un elemento no crea su HTML en la tienda. Todavía no hay edición desde el panel de selectores existentes ni archivado de elementos.

Configuración de la infraestructura

La publicación depende del cron, de media con permisos de escritura y de la cache. La hoja CSS se genera antes de la activación, y después se sirve de forma estática. El módulo no añade JavaScript de color al storefront normal. Esto no implica una garantía de un resultado de rendimiento concreto — las mediciones deben realizarse en la tienda de destino.

Con Varnish, comprueba el acceso a los servidores purge. Con CDN y varios nodos, comprueba la propagación de HTML y la disponibilidad de las hojas. Los detalles de despliegue se encuentran en la instrucción de instalación.

Kowal Hyva Colors — instalación y actualización

Instrucciones para la versión 0.1.6. Ejecute los comandos en el directorio raíz de Magento como usuario de despliegue, dentro del procedimiento estándar de deployment de la tienda. Primero compruebe la instalación en un entorno de pruebas.

Requisitos

Las dependencias completas se especifican en composer.json. Los requisitos de las dependencias no constituyen una declaración de que se hayan probado todas las combinaciones de versiones. Actualmente, la validación de publicación rechaza los temas hijo, incluso si heredan de Hyvä.

1. Acceso a Composer

Configure el repositorio Composer que proporciona kowal/module-hyva-colors y kowal/base, de acuerdo con los datos recibidos del proveedor. También se necesita acceso autorizado al repositorio de Hyvä. La dirección del repositorio y el método de autorización dependen del acceso proporcionado; estas instrucciones no presuponen la disponibilidad pública del paquete.

Ejemplo de esquema de configuración — sustituya la dirección por la dirección real del repositorio Composer:

composer config repositories.kowal composer 'https://ADRES-REPOZYTORIUM-COMPOSER'

Guarde las credenciales fuera del repositorio del proyecto, por ejemplo en un auth.json privado o en la configuración de CI. No las copie en la documentación.

2. Instalación

Después de publicar la versión 0.1.6 en el repositorio:

composer require kowal/module-hyva-colors:0.1.6 --with-all-dependenciesphp bin/magento module:enable Kowal_Base Kowal_HyvaColorsphp bin/magento setup:upgradephp bin/magento setup:di:compilephp bin/magento setup:static-content:deploy pl_PL en_USphp bin/magento cache:clean config layout block_html full_pagephp bin/magento module:status Kowal_HyvaColorsphp bin/magento kowal:hyva-colors:diagnose

Los locales indicados son solo un ejemplo — despliegue los idiomas utilizados por la tienda y el panel. Integre la generación de DI y de recursos en el procedimiento estándar de despliegue, en lugar de ejecutarla mientras se atiende tráfico en el catálogo de producción activo.

La instalación crea el catálogo y los conjuntos iniciales. No publica colores ni modifica el aspecto de la tienda. El comando diagnose comprueba el catálogo del paquete e informa del alcance de las funciones; no es una prueba completa del entorno.

3. Cron y archivos CSS

El módulo utiliza la tarea kowal_hyva_colors_publish en el grupo cron default, programada cada minuto. En el servidor debe estar funcionando el cron estándar de Magento. Una ejecución procesa como máximo 10 tareas; la publicación no tiene por qué ser inmediata.

Procesamiento manual de la cola para diagnóstico:

php bin/magento kowal:hyva-colors:publication:process

Compruebe el estado de una tarea concreta en «Historial de cambios» — que el comando se ejecute correctamente no significa que todas las tareas hayan finalizado con éxito.

Las hojas se guardan en pub/media/kowal/hyva-colors//.css. Garantice la posibilidad de escritura y lectura mediante HTTP. Con varios nodos, media debe ser compartido. Para estos archivos inmutables se pueden configurar Content-Type: text/css, compresión y Cache-Control: public, max-age=31536000, immutable. El módulo no establece la configuración del servidor ni del CDN.

4. Verificación de la instalación

1. Abra kowal.store → Modules → Hyva Colors. Si el menú no está visible, compruebe Kowal Base y los permisos del rol.
2. Revise las tres páginas: «Conjuntos y publicación», «Mis conjuntos», «Historial de cambios».
3. En un store view de prueba, publique una paleta y espere a que la tarea finalice.
4. Compruebe el encabezado, la cuenta, el minicarrito, la categoría y el producto en desktop y móvil, también hover/focus.
5. Confirme la disponibilidad del CSS, la actualización de FPC/Varnish y de todos los nodos CDN.
6. Publique un restablecimiento al tema nativo y, a continuación, compruebe la restauración de una publicación anterior.

Actualización

Después de publicar una nueva versión:

composer update kowal/module-hyva-colors kowal/base --with-all-dependenciesphp bin/magento setup:upgradephp bin/magento setup:di:compilephp bin/magento setup:static-content:deploy pl_PL en_USphp bin/magento cache:clean config layout block_html full_page

Compruebe la restricción de versión en el composer.json principal de la tienda: un 0.1.6 exacto no permitirá que el comando update seleccione una versión más reciente. Cámbiela de forma consciente, por ejemplo mediante composer require ...:NOWA-WERSJA --with-all-dependencies.

La actualización no sustituye la publicación activa por una paleta nueva. Después de cambios de fábrica, seleccione de nuevo un conjunto listo para usar y publíquelo. Los borradores propios guardados conservan sus propios valores.

Problemas durante la instalación

• El paquete no está disponible: compruebe la disponibilidad de la versión, los repositorios y la autorización de Composer.
• Falta el menú: compruebe la activación de Kowal_Base, los permisos del rol y la cache de configuración; actualice el panel.
• Conflicto de catálogo: ejecute php bin/magento kowal:hyva-colors:catalog:sync --dry-run. Compare las definiciones modificadas antes de sincronizar; no sobrescriba manualmente sus propios elementos.
• Error de Interceptor tras una versión antigua: asegúrese de que Composer ha instalado el paquete corregido y reconstruya el código generado en el proceso estándar de deployment.
• Los colores no cambian: compruebe el historial, cron, el tema activo, el CSS en media y la propagación de cache.

El restablecimiento de colores se realiza en el panel. No requiere desinstalar el módulo ni borrar tablas. Antes de desactivar o eliminar el módulo, exporte los conjuntos necesarios y realice una copia de la base de datos de acuerdo con el procedimiento de mantenimiento de la tienda.