CSS personalizzato

Guida pratica Tutti i piani 2 min di lettura

Usa Foglio di stile / CSS quando le impostazioni, i caratteri e i colori non bastano: un effetto speciale al passaggio del mouse, la dimensione del carattere di una voce o una piccola correzione al tema. Il CSS viene salvato con il menu e aggiunto al tuo negozio online quando pubblichi.

Nota

Il CSS personalizzato richiede conoscenze di base di CSS. Se preferisci non scrivere codice, contattaci: ti aiutiamo gratuitamente con piccole modifiche di stile.

Aggiungi CSS personalizzato

1. Apri la scheda Avanzate

   Nell’editor dei menu, fai clic sull’icona Avanzate (</>) nella barra laterale sinistra (1).

   

   Apri la scheda Avanzate (1) e digita il tuo CSS in Foglio di stile / CSS (2).

2. Aggiungi il tuo CSS

   Digita o incolla il tuo CSS in Foglio di stile / CSS (2), sostituendo il segnaposto //enter css custom here.

3. Salva e pubblica

   Fai clic su Salva, poi su Pubblica. Aggiorna forzatamente il tuo negozio online per vedere il risultato.

Scegli gli elementi giusti

Il CSS viene aggiunto alla pagina così com’è e non è limitato a questo menu, quindi delimita i tuoi selettori:

• Tutti i menu: inizia con .gm-menu.
• Un menu: inizia con .gm-menu-<ID>. Per trovare l’ID, fai clic con il pulsante destro sul menu nel tuo negozio online e scegli Ispeziona.
• Una voce: assegnale un Nome classe extra nella sezione Avanzate delle impostazioni della voce (vedi Modifica una voce di menu), poi usa quella classe.

Ad esempio, per rendere in grassetto e rossa una voce con il nome classe extra sale-item:

.gm-menu .sale-item > .gm-target {
  color: #d72c0d !important;
  font-weight: 700 !important;
}

La scheda Avanzate contiene anche Disponibilità per mercato, che limita il menu ai mercati selezionati: vedi Mostra i menu per mercato.

Risoluzione dei problemi

Il mio CSS non ha effetto

• Controlla di aver fatto clic su Pubblica dopo il salvataggio.
• Gli stili dell’app usano spesso !important, quindi potrebbe servire anche alla tua regola.
• Cerca errori di battitura come una } mancante: un solo errore può bloccare il funzionamento delle regole successive.

Pagine correlate

• Regola i colori del menuImposta i colori della barra del menu, dei sottomenu, delle schede, delle etichette dei prodotti e del pulsante Aggiungi al carrello.
• Regola i font del menuScegli la famiglia di caratteri, lo spessore e la dimensione per ogni parte del menu.
• Modifica una voce di menuCambia titolo, link, icona, colori, badge, sottomenu e visibilità di una voce, oppure duplicala, spostala ed eliminala.

Questa pagina ti è stata utile?

Segnala un problema