Kowal Hyva Colors — Shopfarben unter Kontrolle

Panel und Berechtigungen

Sie öffnen das Modul über kowal.store → Modules → Hyva Colors. Die Konfiguration erfolgt in seinen drei Ansichten und nicht in einem separaten Bereich Stores → Configuration.

Der Administrator vergibt Berechtigungen unter System → Permissions → User Roles. Weisen Sie den Rollen die entsprechenden übergeordneten Kowal-Menüressourcen und Hyva Colors-Ressourcen zu:

Ein Import, der neue Katalogdefinitionen enthält, erfordert zusätzlich die Berechtigung zum Hinzufügen von Elementen. Nach einer Rollenänderung kann eine erneute Anmeldung des Benutzers erforderlich sein.

Shop-Bereich

Bei der Veröffentlichung wählen Sie einen aktiven Store View aus. Das Modul prüft das zugewiesene Theme: Das aktuelle Profil unterstützt genau Hyva/default mit Default Theme 1.5.2–1.5.x. Weisen Sie kein anderes Theme nur deshalb zu, um die Validierung zu umgehen — Child-Themes erfordern eine separate Vorbereitung der Mappings.

Ein Set ist ein wiederverwendbarer Entwurf. Sie können es separat für mehrere Store Views veröffentlichen. In dieser Version gibt es keine vererbte Konfiguration auf der Ebene default/website/store.

System-Sets und eigene Sets

Die fertigen Definitionen umfassen sieben Paletten und ein leeres natives Set. Ihre gespeicherten Kopien sind unter ‚Meine Sets‘ verfügbar. Am bequemsten erstellen Sie eigene Sets auf dieser Grundlage — so bleiben die Originale als Referenz erhalten.

Farbeditor

Der Editor unterteilt den Katalog in die Bereiche: Global, Header, Buttons, Product cards sowie Catalog and product page. Die Namen können auf Englisch bleiben. Der initiale Katalog enthält 34 Elemente und 99 Mappings. Ein einzelnes Element kann separate Einträge für Hintergrund, Text, Rahmen und Interaktionszustände haben.

Verfügbare Methoden zum Setzen von Werten:

native fügt kein CSS inherit ein. Der Wert transparent ist eine explizite transparente Farbe und keine Rückkehr zum Theme. Sie können auch currentColor verwenden. Beliebige CSS-Funktionen wie rgb() oder var() werden in Farbfeldern nicht akzeptiert.

Speichern Sie den Entwurf, bevor Sie den Bereich oder die Seite des Editors wechseln. Das Speichern veröffentlicht keine Änderungen.

Gemeinsame Farben: Tokens

Unter ‚Palette — erweiterte Einstellungen (JSON)‘ werden benannte Farben gespeichert. Beispielausschnitt:

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

Wählen Sie in der Elementzeile ‚Farbe aus der Palette‘ und geben Sie brand ein. Eine Änderung des Tokens aktualisiert bei der nächsten Veröffentlichung alle Werte, die darauf verweisen. Wenn Sie ein fertiges Set bearbeiten, behalten Sie die übrigen vorhandenen Tokens bei — das Ersetzen des gesamten JSON durch den obigen Ausschnitt kann nicht aufgelöste Verweise hinterlassen. Zyklen und fehlende Tokens werden abgelehnt.

Hinzufügen von Elementen und Bereichen

Dies erfordert keine Änderung der Moduldateien, setzt aber die Ermittlung des richtigen CSS-Selektors voraus. Das Modul hat keinen visuellen Element-Inspektor.

1. Öffnen Sie den Editor eines beliebigen Sets.
2. Klappen Sie ‚Eigenes Element hinzufügen — erweiterter Modus‘ auf.
3. Geben Sie einen Namen ein, z. B. ‚Werbebanner‘.
4. Wählen Sie einen vorhandenen Bereichsnamen aus oder geben Sie einen neuen ein, z. B. ‚Aktionen‘.
5. Geben Sie einen stabilen Selektor ein, z. B. #promo-banner, der im Shop existiert.
6. Wählen Sie Eigenschaften aus, z. B. background-color, color, border-color.
7. Wählen Sie Zustände aus, z. B. normal und hover, und fügen Sie anschließend das Element hinzu.
8. Öffnen Sie den entsprechenden Bereich, weisen Sie Farben zu, speichern und veröffentlichen Sie das Set.

Die Definition wird in den gemeinsamen Katalog übernommen; allein ihr Hinzufügen setzt nicht die Farben in allen Sets. Der Selektor sollte möglichst präzise sein. In dieser Version werden Selektorlisten, :has() und beliebige CSS-Deklarationen nicht unterstützt. Das Hinzufügen eines Elements erstellt nicht dessen HTML im Shop. Eine Bearbeitung vorhandener Selektoren und eine Archivierung von Elementen im Panel gibt es noch nicht.

Infrastrukturkonfiguration

Die Veröffentlichung hängt von Cron, beschreibbaren Medien und Cache ab. Das CSS-Stylesheet wird vor der Aktivierung generiert und anschließend statisch ausgeliefert. Das Modul fügt dem normalen Storefront kein farbbezogenes JavaScript hinzu. Dies bedeutet keine Garantie für ein bestimmtes Performance-Ergebnis — Messungen sollten im Zielshop durchgeführt werden.

Bei Varnish prüfen Sie den Zugriff auf die Purge-Server. Bei CDN und mehreren Knoten prüfen Sie die Propagation von HTML sowie die Verfügbarkeit der Stylesheets. Deployment-Details finden Sie in der Installationsanleitung.

Kowal Hyva Colors — Installation und Aktualisierung

Anleitung für Version 0.1.6. Führen Sie die Befehle im Magento-Stammverzeichnis als Deployment-Benutzer im Rahmen des standardmäßigen Shop-Deployment-Prozesses aus. Prüfen Sie die Installation zuerst in einer Testumgebung.

Anforderungen

Die vollständigen Abhängigkeiten werden in composer.json definiert. Die Anforderungen der Abhängigkeiten sind keine Erklärung, dass alle Versionskombinationen getestet wurden. Ein Child Theme wird derzeit von der Veröffentlichungsvalidierung abgelehnt, auch wenn es von Hyvä erbt.

1. Zugriff auf Composer

Konfigurieren Sie das Composer-Repository, das kowal/module-hyva-colors und kowal/base bereitstellt, gemäß den vom Anbieter erhaltenen Daten. Außerdem ist ein berechtigter Zugriff auf das Hyvä-Repository erforderlich. Die Repository-Adresse und die Art der Autorisierung hängen vom bereitgestellten Zugriff ab; diese Anleitung setzt keine öffentliche Verfügbarkeit des Pakets voraus.

Beispielhaftes Konfigurationsschema — ersetzen Sie die Adresse durch die tatsächliche Adresse des Composer-Repositorys:

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

Speichern Sie Zugangsdaten außerhalb des Projekt-Repositorys, z. B. in einer privaten auth.json oder in der CI-Konfiguration. Kopieren Sie sie nicht in die Dokumentation.

2. Installation

Nachdem Release 0.1.6 im Repository bereitgestellt wurde:

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

Die angegebenen Locales sind ein Beispiel — deployen Sie die Sprachen, die vom Shop und vom Panel verwendet werden. Kombinieren Sie die Generierung von DI und Assets mit dem standardmäßigen Deployment-Prozess, anstatt sie während der Verarbeitung von Traffic auf einem aktiven Produktionsverzeichnis auszuführen.

Die Installation erstellt den Katalog und die Startsets. Sie veröffentlicht keine Farben und ändert das Erscheinungsbild des Shops nicht. Der Befehl diagnose prüft den Paketkatalog und berichtet den Funktionsumfang; er ist kein vollständiger Umgebungstest.

3. Cron und CSS-Dateien

Das Modul verwendet die Aufgabe kowal_hyva_colors_publish in der Cron-Gruppe default, die jede Minute geplant wird. Auf dem Server muss der standardmäßige Magento-Cron laufen. Eine Ausführung verarbeitet maximal 10 Aufgaben; die Veröffentlichung muss nicht sofort erfolgen.

Manuelle Verarbeitung der Warteschlange zur Diagnose:

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

Prüfen Sie den Status einer konkreten Aufgabe in der Änderungshistorie — eine erfolgreiche Ausführung des Befehls bedeutet nicht, dass jede Aufgabe erfolgreich abgeschlossen wurde.

Die Stylesheets werden unter pub/media/kowal/hyva-colors//.css gespeichert. Stellen Sie Schreibzugriff und Lesbarkeit per HTTP sicher. Bei mehreren Knoten müssen die Medien gemeinsam genutzt werden. Für diese unveränderlichen Dateien können Content-Type: text/css, Komprimierung und Cache-Control: public, max-age=31536000, immutable konfiguriert werden. Das Modul setzt keine Server- oder CDN-Konfiguration.

4. Abnahme der Installation

1. Öffnen Sie kowal.store → Modules → Hyva Colors. Wenn das Menü nicht sichtbar ist, prüfen Sie Kowal Base und die Rollenberechtigungen.
2. Prüfen Sie drei Seiten: Sets und Veröffentlichung, Meine Sets, Änderungshistorie.
3. Veröffentlichen Sie in einem Test-Store-View eine Palette und warten Sie, bis die Aufgabe abgeschlossen ist.
4. Prüfen Sie Header, Konto, Miniwarenkorb, Kategorie und Produkt auf Desktop und Smartphone, auch Hover/Focus.
5. Bestätigen Sie die Verfügbarkeit des CSS, die Aktualisierung von FPC/Varnish und aller CDN-Knoten.
6. Veröffentlichen Sie einen Reset auf das native Theme und prüfen Sie anschließend die Wiederherstellung einer früheren Veröffentlichung.

Aktualisierung

Nachdem ein neues Release bereitgestellt wurde:

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

Prüfen Sie die Versionsbeschränkung in der Hauptdatei composer.json des Shops: Ein exaktes 0.1.6 erlaubt dem Befehl update nicht, ein neueres Release auszuwählen. Ändern Sie dies bewusst, z. B. mit composer require ...:NOWA-WERSJA --with-all-dependencies.

Die Aktualisierung ersetzt die aktive Veröffentlichung nicht durch eine neue Palette. Wählen Sie nach werkseitigen Änderungen das fertige Set erneut aus und veröffentlichen Sie es. Gespeicherte eigene Entwürfe behalten ihre eigenen Werte.

Probleme bei der Installation

• Paket ist nicht verfügbar: Prüfen Sie die Verfügbarkeit des Releases, die Repositorys und die Composer-Autorisierung.
• Menü fehlt: Prüfen Sie die Aktivierung von Kowal_Base, Rollenrechte und den Konfigurationscache; aktualisieren Sie das Panel.
• Katalogkonflikt: Führen Sie php bin/magento kowal:hyva-colors:catalog:sync --dry-run aus. Vergleichen Sie die geänderten Definitionen vor der Synchronisierung; überschreiben Sie eigene Elemente nicht manuell.
• Interceptor-Fehler nach alter Version: Stellen Sie sicher, dass Composer das korrigierte Paket installiert hat, und bauen Sie den generierten Code im standardmäßigen Deployment-Prozess neu auf.
• Farben ändern sich nicht: Prüfen Sie Historie, Cron, aktives Theme, CSS in media und die Cache-Propagation.

Das Zurücksetzen der Farben erfolgt im Panel. Es erfordert weder die Deinstallation des Moduls noch das Löschen von Tabellen. Exportieren Sie vor dem Deaktivieren oder Entfernen des Moduls die benötigten Sets und erstellen Sie gemäß dem Wartungsverfahren des Shops eine Datenbanksicherung.