Kowal Hyva Colors — i colori del negozio sotto controllo

Pannello e permessi

Apri il modulo da kowal.store → Modules → Hyva Colors. La configurazione avviene nelle sue tre viste, non in una sezione separata Stores → Configuration.

L’amministratore assegna i permessi in System → Permissions → User Roles. Concedi ai ruoli le risorse di menu Kowal superiori appropriate e le risorse Hyva Colors:

Un import contenente nuove definizioni di catalogo richiede anche il diritto di aggiungere elementi. Dopo una modifica del ruolo potrebbe essere necessario che l’utente effettui nuovamente l’accesso.

Ambito dello store

Durante la pubblicazione selezioni un singolo store view attivo. Il modulo controlla il tema assegnato: il profilo attuale supporta esattamente Hyva/default con Default Theme 1.5.2–1.5.x. Non assegnare un tema diverso solo per aggirare la validazione — i temi child richiedono una preparazione separata delle mappature.

Un set è una bozza riutilizzabile. Puoi pubblicarlo separatamente per più viste. In questa versione non è presente una configurazione ereditata a livello default/website/store.

Set di sistema e personalizzati

Le definizioni pronte includono sette palette e un set nativo vuoto. Le loro copie salvate sono disponibili in «I miei set». Il modo più comodo è creare set personalizzati a partire da questi — così gli originali restano un punto di riferimento.

Editor dei colori

L’editor divide il catalogo in sezioni: Global, Header, Buttons, Product cards e Catalog and product page. I nomi possono rimanere in inglese. Il catalogo iniziale contiene 34 elementi e 99 mappature. Un singolo elemento può avere voci separate per sfondo, testo, bordo e stati di interazione.

Modalità disponibili per impostare il valore:

native non inserisce il CSS inherit. Il valore transparent è un colore trasparente esplicito, non un ritorno al tema. Puoi utilizzare anche currentColor. Funzioni CSS arbitrarie, come rgb() o var(), non sono accettate nei campi colore.

Salva la bozza prima di cambiare sezione o pagina dell’editor. Il salvataggio non pubblica le modifiche.

Colori condivisi: token

In «Palette — impostazioni avanzate (JSON)» vengono memorizzati i colori denominati. Esempio di frammento:

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

Nella riga dell’elemento seleziona «Colore dalla palette» e inserisci brand. La modifica del token aggiorna tutti i valori che vi fanno riferimento alla pubblicazione successiva. Se modifichi un set pronto, mantieni gli altri token esistenti — sostituire l’intero JSON con il frammento sopra può lasciare riferimenti non risolti. Cicli e token mancanti vengono rifiutati.

Aggiunta di elementi e sezioni

Non richiede la modifica dei file del modulo, ma richiede l’identificazione del selettore CSS corretto. Il modulo non dispone di un ispettore visivo degli elementi.

1. Apri l’editor di un set qualsiasi.
2. Espandi «Aggiungi elemento personalizzato — modalità avanzata».
3. Inserisci un nome, ad esempio «Banner promozionale».
4. Seleziona il nome di una sezione esistente oppure inseriscine una nuova, ad esempio «Promozioni».
5. Inserisci un selettore stabile, ad esempio #promo-banner, che esiste nello store.
6. Seleziona le proprietà, ad esempio background-color, color, border-color.
7. Seleziona gli stati, ad esempio normal e hover, quindi aggiungi l’elemento.
8. Apri la sezione appropriata, assegna i colori, salva e pubblica il set.

La definizione viene aggiunta al catalogo condiviso; la sola aggiunta non imposta i colori in tutti i set. Il selettore dovrebbe essere il più preciso possibile. In questa versione non sono supportati elenchi di selettori, :has() né dichiarazioni CSS arbitrarie. L’aggiunta di un elemento non crea il suo HTML nello store. Non è ancora disponibile la modifica dal pannello dei selettori esistenti né l’archiviazione degli elementi.

Configurazione dell’infrastruttura

La pubblicazione dipende dal cron, dai media scrivibili e dalla cache. Il foglio CSS viene generato prima dell’attivazione e poi servito staticamente. Il modulo non aggiunge JavaScript per i colori allo storefront standard. Questo non significa una garanzia di uno specifico risultato prestazionale — le misurazioni devono essere eseguite nello store di destinazione.

Con Varnish controlla l’accesso ai server purge. Con CDN e più nodi controlla la propagazione dell’HTML e la disponibilità dei fogli di stile. I dettagli di deployment sono contenuti nella guida all’installazione.

Kowal Hyva Colors — installazione e aggiornamento

Istruzioni per la versione 0.1.6. Esegui i comandi nella directory principale di Magento come utente di deploy, nell’ambito della procedura standard di deployment del negozio. Verifica prima l’installazione in ambiente di test.

Requisiti

Le dipendenze complete sono definite da composer.json. I requisiti delle dipendenze non costituiscono una dichiarazione di test di tutte le combinazioni di versioni. Attualmente un tema child viene rifiutato dalla validazione della pubblicazione, anche se eredita da Hyvä.

1. Accesso a Composer

Configura il repository Composer che rende disponibili kowal/module-hyva-colors e kowal/base, in conformità ai dati ricevuti dal fornitore. È inoltre necessario un accesso autorizzato al repository Hyvä. L’indirizzo del repository e il metodo di autorizzazione dipendono dall’accesso fornito; queste istruzioni non presuppongono la disponibilità pubblica del pacchetto.

Esempio di schema di configurazione — sostituisci l’indirizzo con l’indirizzo reale del repository Composer:

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

Conserva le credenziali fuori dal repository del progetto, ad esempio in un auth.json privato o nella configurazione CI. Non copiarle nella documentazione.

2. Installazione

Dopo aver reso disponibile la release 0.1.6 nel repository:

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

I locale indicati sono un esempio — deploya le lingue utilizzate dal negozio e dal pannello. Integra la generazione DI e delle risorse nella procedura standard di deployment, invece di eseguirle durante la gestione del traffico sul catalogo di produzione attivo.

L’installazione crea il catalogo e i set iniziali. Non pubblica i colori e non modifica l’aspetto del negozio. Il comando diagnose controlla il catalogo del pacchetto e riporta l’ambito delle funzioni; non è un test completo dell’ambiente.

3. Cron e file CSS

Il modulo utilizza il job kowal_hyva_colors_publish nel gruppo cron default, pianificato ogni minuto. Sul server deve essere attivo il cron Magento standard. Una singola esecuzione gestisce al massimo 10 job; la pubblicazione non deve necessariamente essere immediata.

Elaborazione manuale della coda a fini diagnostici:

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

Controlla lo stato di un job specifico in ‘Cronologia modifiche’ — l’esecuzione riuscita del comando non significa che ogni job sia terminato con successo.

I fogli vengono salvati in pub/media/kowal/hyva-colors//.css. Assicurati che siano possibili la scrittura e la lettura tramite HTTP. Con più nodi, i media devono essere condivisi. Per questi file immutabili è possibile configurare Content-Type: text/css, compressione e Cache-Control: public, max-age=31536000, immutable. Il modulo non imposta la configurazione del server né della CDN.

4. Verifica dell’installazione

1. Apri kowal.store → Modules → Hyva Colors. Se il menu non è visibile, controlla Kowal Base e le autorizzazioni del ruolo.
2. Controlla le tre pagine: ‘Set e pubblicazione’, ‘I miei set’, ‘Cronologia modifiche’.
3. Su una store view di test pubblica una palette e attendi il completamento del job.
4. Controlla header, account, minicart, categoria e prodotto su desktop e telefono, inclusi hover/focus.
5. Conferma la disponibilità del CSS, l’aggiornamento di FPC/Varnish e di tutti i nodi CDN.
6. Pubblica il reset al tema nativo, quindi controlla il ripristino di una pubblicazione precedente.

Aggiornamento

Dopo aver reso disponibile una nuova release:

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

Controlla il vincolo di versione nel composer.json principale del negozio: il valore esatto 0.1.6 non consentirà al comando update di selezionare una release più recente. Modificalo consapevolmente, ad esempio tramite composer require ...:NOWA-WERSJA --with-all-dependencies.

L’aggiornamento non sostituisce la pubblicazione attiva con una nuova palette. Dopo le modifiche di fabbrica, seleziona nuovamente un set pronto e pubblicalo. Le bozze personalizzate salvate mantengono i propri valori.

Problemi durante l’installazione

• Il pacchetto non è disponibile: controlla la disponibilità della release, i repository e l’autorizzazione Composer.
• Menu assente: controlla l’attivazione di Kowal_Base, i permessi del ruolo e la cache della configurazione; aggiorna il pannello.
• Conflitto del catalogo: esegui php bin/magento kowal:hyva-colors:catalog:sync --dry-run. Confronta le definizioni modificate prima della sincronizzazione; non sovrascrivere manualmente i tuoi elementi personalizzati.
• Errore Interceptor dopo una vecchia versione: assicurati che Composer abbia installato il pacchetto corretto e ricompila il codice generato nel processo standard di deployment.
• I colori non cambiano: controlla cronologia, cron, tema attivo, CSS nei media e propagazione della cache.

Il reset dei colori si esegue dal pannello. Non richiede la disinstallazione del modulo né l’eliminazione delle tabelle. Prima di disattivare o rimuovere il modulo, esporta i set necessari ed esegui una copia del database secondo la procedura di manutenzione del negozio.