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. Rendi disponibili ai ruoli le risorse di menu superiori Kowal e le risorse Hyva Colors appropriate:

Un import che contiene nuove definizioni del catalogo richiede anche il permesso di aggiungere elementi. Dopo la modifica del ruolo può essere necessario eseguire nuovamente il login dell’utente.

Ambito del negozio

Durante la pubblicazione scegli un solo vista negozio (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 altro tema solo per aggirare la validazione — i temi child richiedono una preparazione separata delle mappature.

Il 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 relative copie salvate sono disponibili in «I miei set». Il modo più comodo è creare set personalizzati a partire da esse — così gli originali restano un punto di riferimento.

Editor colori

L’editor divide il catalogo in sezioni: Global, Header, Buttons, Product cards e Catalog and product page. I nomi possono restare 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 usare 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)» sono conservati i colori nominati. 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 all’uso, mantieni gli altri token esistenti — la sostituzione dell’intero JSON con il frammento precedente potrebbe 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 qualsiasi set.
2. Espandi «Aggiungi elemento personalizzato — modalità avanzata».
3. Inserisci il nome, ad es. «Banner promozionale».
4. Scegli il nome di una sezione esistente oppure inseriscine una nuova, ad es. «Promozioni».
5. Inserisci un selettore stabile, ad es. #promo-banner, esistente nel negozio.
6. Scegli le proprietà, ad es. background-color, color, border-color.
7. Scegli gli stati, ad es. normal e hover, quindi aggiungi l’elemento.
8. Apri la sezione appropriata, assegna i colori, salva e pubblica il set.

La definizione viene inserita nel 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 nel negozio. Non è ancora disponibile la modifica da pannello dei selettori esistenti né l’archiviazione degli elementi.

Configurazione dell’infrastruttura

La pubblicazione dipende da cron, media scrivibili e cache. Il foglio CSS viene generato prima dell’attivazione, poi servito staticamente. Il modulo non aggiunge JavaScript relativo ai colori al normale storefront. Questo non significa una garanzia di uno specifico risultato prestazionale — le misurazioni devono essere effettuate nel negozio di destinazione.

Con Varnish controlla l’accesso ai server purge. Con CDN e più nodi controlla la propagazione HTML e la disponibilità dei fogli. I dettagli di deploy 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. Prima verifica l’installazione in un ambiente di test.

Requisiti

Le dipendenze complete sono definite in composer.json. I requisiti delle dipendenze non costituiscono una dichiarazione di test di tutte le combinazioni di versioni. Il tema child è attualmente 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, secondo i dati ricevuti dal fornitore. È necessario anche un accesso autorizzato al repository Hyvä. L’indirizzo del repository e il metodo di autorizzazione dipendono dall’accesso fornito; questa istruzione non presuppone 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 es. in un auth.json privato o nella configurazione CI. Non copiarle nella documentazione.

2. Installazione

Dopo la disponibilità della 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 — distribuisci le lingue utilizzate dal negozio e dal pannello. Integra la generazione DI e degli asset nella procedura di deploy standard, invece di eseguirle durante la gestione del traffico su una directory di produzione attiva.

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

3. Cron e file CSS

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

Elaborazione manuale della coda per diagnostica:

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

Controlla lo stato di una specifica attività in «Cronologia delle modifiche» — l’esecuzione corretta del comando non significa che ogni attività sia terminata con successo.

I fogli vengono salvati in pub/media/kowal/hyva-colors//.css. Assicurati che siano possibili scrittura e lettura via 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é del CDN.

4. Collaudo dell’installazione

1. Apri kowal.store → Modules → Hyva Colors. Se il menu non è visibile, controlla Kowal Base e i permessi del ruolo.
2. Controlla le tre pagine: «Set e pubblicazione», «I miei set», «Cronologia delle modifiche».
3. Su uno store view di test pubblica una palette e attendi il completamento dell’attività.
4. Controlla header, account, mini carrello, 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 verifica il ripristino di una pubblicazione precedente.

Aggiornamento

Dopo la disponibilità di 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 scegliere una release più recente. Modificalo consapevolmente, ad es. tramite composer require ...:NOWA-WERSJA --with-all-dependencies.

L’aggiornamento non sostituisce la pubblicazione attiva con una nuova palette. Dopo modifiche di fabbrica, seleziona nuovamente il set pronto all’uso 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 diritti 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 gli elementi personalizzati.
• Errore Interceptor dopo una vecchia versione: assicurati che Composer abbia installato il pacchetto corretto e ricostruisci il codice generato nel processo di deployment standard.
• I colori non cambiano: controlla cronologia, cron, tema attivo, CSS nei media e propagazione della cache.

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