Kowal Hyva Colors — les couleurs de votre boutique sous contrôle

Panneau et autorisations

Vous ouvrez le module via kowal.store → Modules → Hyva Colors. La configuration s’effectue dans ses trois vues, et non dans une section distincte Stores → Configuration.

L’administrateur attribue les autorisations dans System → Permissions → User Roles. Accordez aux rôles les ressources de menu parentes Kowal appropriées et les ressources Hyva Colors :

Un import contenant de nouvelles définitions de catalogue nécessite également le droit d’ajouter des éléments. Après un changement de rôle, une reconnexion de l’utilisateur peut être nécessaire.

Périmètre de la boutique

Lors de la publication, vous choisissez une seule vue de boutique (store view) active. Le module vérifie le thème attribué : le profil actuel prend en charge exactement Hyva/default avec Default Theme 1.5.2–1.5.x. N’attribuez pas un autre thème uniquement pour contourner la validation — les thèmes enfants nécessitent une préparation distincte des mappages.

Un ensemble est un brouillon réutilisable. Vous pouvez le publier séparément pour plusieurs vues. Dans cette version, il n’existe pas de configuration héritée au niveau default/website/store.

Ensembles système et personnalisés

Les définitions prêtes à l’emploi comprennent sept palettes et un ensemble natif vide. Leurs copies enregistrées sont disponibles dans Mes ensembles. La façon la plus pratique de créer vos propres ensembles consiste à vous appuyer sur ceux-ci — les originaux restent ainsi des points de référence.

Éditeur de couleurs

L’éditeur divise le catalogue en sections : Global, Header, Buttons, Product cards et Catalog and product page. Les noms peuvent rester en anglais. Le catalogue initial contient 34 éléments et 99 mappages. Un seul élément peut avoir des entrées distinctes pour l’arrière-plan, le texte, la bordure et les états d’interaction.

Modes disponibles pour définir les valeurs :

native n’insère pas le CSS inherit. La valeur transparent est une couleur transparente explicite, et non un retour au thème. Vous pouvez également utiliser currentColor. Les fonctions CSS libres, telles que rgb() ou var(), ne sont pas acceptées dans les champs de couleur.

Enregistrez le brouillon avant de changer de section ou de page de l’éditeur. L’enregistrement ne publie pas les changements.

Couleurs partagées : tokens

Les couleurs nommées sont stockées dans Palette — paramètres avancés (JSON). Exemple d’extrait :

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

Dans la ligne de l’élément, choisissez Couleur de la palette et saisissez brand. La modification du token met à jour toutes les valeurs qui y font référence lors de la publication suivante. Si vous modifiez un ensemble prêt à l’emploi, conservez les autres tokens existants — remplacer tout le JSON par l’extrait ci-dessus peut laisser des références non résolues. Les cycles et les tokens manquants sont rejetés.

Ajout d’éléments et de sections

Cela ne nécessite pas de modifier les fichiers du module, mais exige d’identifier le bon sélecteur CSS. Le module ne dispose pas d’inspecteur visuel des éléments.

1. Ouvrez l’éditeur de n’importe quel ensemble.
2. Développez Ajouter un élément personnalisé — mode avancé.
3. Saisissez un nom, par ex. Bannière promotionnelle.
4. Choisissez un nom de section existant ou saisissez-en un nouveau, par ex. Promotions.
5. Indiquez un sélecteur stable, par ex. #promo-banner, qui existe dans la boutique.
6. Choisissez les propriétés, par ex. background-color, color, border-color.
7. Choisissez les états, par ex. normal et hover, puis ajoutez l’élément.
8. Ouvrez la section appropriée, attribuez les couleurs, enregistrez et publiez l’ensemble.

La définition est ajoutée au catalogue partagé ; son ajout seul ne définit pas les couleurs dans tous les ensembles. Le sélecteur doit être aussi précis que possible. Dans cette version, les listes de sélecteurs, :has() et les déclarations CSS libres ne sont pas prises en charge. L’ajout d’un élément ne crée pas son HTML dans la boutique. Il n’existe pas encore d’édition des sélecteurs existants ni d’archivage des éléments depuis le panneau.

Configuration de l’infrastructure

La publication dépend du cron, des médias inscriptibles et du cache. La feuille CSS est générée avant l’activation, puis servie de manière statique. Le module n’ajoute pas de JavaScript de couleur au storefront standard. Cela ne constitue pas une garantie de résultat de performance précis — les mesures doivent être effectuées dans la boutique cible.

Avec Varnish, vérifiez l’accès aux serveurs de purge. Avec un CDN et plusieurs nœuds, vérifiez la propagation HTML ainsi que la disponibilité des feuilles. Les détails de déploiement figurent dans les instructions d’installation.

Kowal Hyva Colors — installation et mise à jour

Instructions pour la version 0.1.6. Exécutez les commandes dans le répertoire racine de Magento en tant qu’utilisateur de déploiement, dans le cadre de la procédure standard de déploiement de la boutique. Vérifiez d’abord l’installation dans un environnement de test.

Exigences

Les dépendances complètes sont définies par composer.json. Les exigences des dépendances ne constituent pas une déclaration de test de toutes les combinaisons de versions. Un thème enfant est actuellement rejeté par la validation de publication, même s’il hérite de Hyvä.

1. Accès à Composer

Configurez le dépôt Composer fournissant kowal/module-hyva-colors et kowal/base, conformément aux informations reçues du fournisseur. Un accès autorisé au dépôt Hyvä est également nécessaire. L’adresse du dépôt et le mode d’autorisation dépendent de l’accès fourni ; cette instruction ne suppose pas la disponibilité publique du package.

Exemple de schéma de configuration — remplacez l’adresse par l’adresse réelle du dépôt Composer :

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

Stockez les identifiants en dehors du dépôt du projet, par exemple dans un auth.json privé ou dans la configuration CI. Ne les copiez pas dans la documentation.

2. Installation

Après la mise à disposition de la version 0.1.6 dans le dépôt :

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

Les locales indiquées sont un exemple — déployez les langues utilisées par la boutique et le panneau. Intégrez la génération DI et des ressources à la procédure standard de déploiement, au lieu de les exécuter pendant le traitement du trafic sur un catalogue de production actif.

L’installation crée le catalogue et les ensembles initiaux. Elle ne publie pas les couleurs et ne modifie pas l’apparence de la boutique. La commande diagnose vérifie le catalogue du package et rapporte l’étendue des fonctionnalités ; elle ne constitue pas un test complet de l’environnement.

3. Cron et fichiers CSS

Le module utilise la tâche kowal_hyva_colors_publish dans le groupe cron default, planifiée toutes les minutes. Le cron Magento standard doit fonctionner sur le serveur. Une exécution traite au maximum 10 tâches ; la publication n’est pas forcément immédiate.

Traitement manuel de la file d’attente à des fins de diagnostic :

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

Vérifiez le statut de la tâche concernée dans Historique des changements — l’exécution réussie de la commande ne signifie pas que chaque tâche s’est terminée avec succès.

Les feuilles sont enregistrées dans pub/media/kowal/hyva-colors//.css. Assurez la possibilité d’écriture et de lecture via HTTP. Avec plusieurs nœuds, les médias doivent être partagés. Pour ces fichiers immuables, vous pouvez configurer Content-Type: text/css, la compression et Cache-Control: public, max-age=31536000, immutable. Le module ne configure ni le serveur ni le CDN.

4. Validation de l’installation

1. Ouvrez kowal.store → Modules → Hyva Colors. Si le menu n’est pas visible, vérifiez Kowal Base et les autorisations du rôle.
2. Vérifiez les trois pages : Ensembles et publication, Mes ensembles, Historique des changements.
3. Sur une store view de test, publiez une palette et attendez la fin de la tâche.
4. Vérifiez l’en-tête, le compte, le minicart, la catégorie et le produit sur ordinateur et sur téléphone, y compris hover/focus.
5. Confirmez la disponibilité du CSS, l’actualisation du FPC/Varnish et de tous les nœuds CDN.
6. Publiez une réinitialisation vers le thème natif, puis vérifiez la restauration d’une publication antérieure.

Mise à jour

Après la mise à disposition d’une nouvelle version :

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

Vérifiez la contrainte de version dans le composer.json principal de la boutique : une version exacte 0.1.6 ne permettra pas à la commande update de sélectionner une version plus récente. Modifiez-la consciemment, par exemple via composer require ...:NOWA-WERSJA --with-all-dependencies.

La mise à jour ne remplace pas la publication active par une nouvelle palette. Après des changements d’usine, sélectionnez à nouveau l’ensemble prêt à l’emploi et publiez-le. Les brouillons personnalisés enregistrés conservent leurs propres valeurs.

Problèmes lors de l’installation

• Le package n’est pas disponible : vérifiez la disponibilité de la version, les dépôts et l’autorisation Composer.
• Menu absent : vérifiez l’activation de Kowal_Base, les droits du rôle et le cache de configuration ; actualisez le panneau.
• Conflit de catalogue : exécutez php bin/magento kowal:hyva-colors:catalog:sync --dry-run. Comparez les définitions modifiées avant la synchronisation ; n’écrasez pas manuellement vos propres éléments.
• Erreur Interceptor après une ancienne version : assurez-vous que Composer a installé le package corrigé et reconstruisez le code généré dans le processus standard de déploiement.
• Les couleurs ne changent pas : vérifiez l’historique, le cron, le thème actif, le CSS dans media et la propagation du cache.

La réinitialisation des couleurs s’effectue dans le panneau. Elle ne nécessite ni la désinstallation du module ni la suppression des tables. Avant de désactiver ou de supprimer le module, exportez les ensembles nécessaires et effectuez une sauvegarde de la base conformément à la procédure de maintenance de la boutique.