Definire lo stile di navigazione

Gli stili dei link di navigazione sono impostati principalmente dall'intestazione del tuo sito. Nell'editor dell'intestazione, puoi modificare:

• Il layout di navigazione
• I colori della navigazione
• La spaziatura del link di navigazione
• Il padding intorno al testo
• La posizione fissa o meno della navigazione
• La visualizzazione della navigazione sui computer rispetto ai dispositivi mobili

Puoi inoltre utilizzare le opzioni in Stili sito per modificare tipi di carattere e dimensioni. Per maggiori informazioni, consulta le sezioni seguenti.

Ogni famiglia di modelli ha i propri Stili sito, pertanto non esiste un'unica regola per aggiornare i link di navigazione. Utilizza questi suggerimenti per trovare le opzioni di stile supportate dal tuo modello:

• Per aprire gli stili del sito, apri il pannello Design, quindi fai clic su Stili sito.
• Scorri i tweak a sinistra e cerca quelli correlati. I tweak di solito includono la parola Navigazione.
• Puoi anche passare il mouse sulla navigazione del tuo sito nell'anteprima sulla destra. Quando intorno alla navigazione appaiono delle caselle di evidenziazione blu, clicca su un link di navigazione. Questo aiuta a escludere i tweak che non interessano i link di navigazione. Quando hai finito, clicca su Mostra tutto per tornare alla vista principale.

Ecco un esempio di ciò che appare nel modello Thorne, che fa parte della Brine family:

Per impostazione predefinita, il tipo di carattere della navigazione corrisponde al tipo di carattere del sito. Per impostare un altro tipo di carattere o una dimensione diversa per la navigazione:

1. Durante la modifica di una pagina, clicca sull'icona del pennello, quindi su Tipi di carattere.
2. In Stili di testo globali, clicca su Assegna stili.
3. Clicca su Navigazione sito.
4. Per modificare il tipo di carattere, clicca su Stile, quindi scegli Personalizzato. Scegli una nuova famiglia di tipi di carattere, spessore, stile e altri dettagli. Clicca su Salva per applicare le modifiche.
5. Per modificare la dimensione, clicca su Dimensione, quindi scegli una dimensione di Paragrafo preimpostata oppure scegli Personalizzata. Per impostare una dimensione personalizzata, utilizza il cursore o inserisci manualmente un nuovo valore rem. Clicca su Salva per applicare le modifiche.

Suggerimento: per scoprire come la versione 7.1 utilizza i valori rem per le dimensioni del tipo di carattere, visita Modificare il tipo di carattere.

Per modificare il tipo di carattere della navigazione, clicca sull'icona v accanto al nome del tweak per aprire il relativo menu a discesa. Da qui puoi modificare:

• Nomi dei tipi di carattere
• Stile
• Taglia
• Altezza della riga
• Spaziatura tra le lettere

Per maggiori informazioni, visita Modificare i tipi di carattere.

Puoi inoltre modificare il tema colore dell'intestazione in sovrapposizione su dispositivi mobili.

Per modificare i colori dei link di navigazione, clicca su un tweak di colore in Stili sito. Scegli un nuovo colore cliccando su un colore nella parte superiore del selettore, quindi seleziona una sfumatura all'interno del quadrato. Puoi anche inserire un valore specifico nel campo di testo. Per maggiori informazioni, consulta Modificare i colori o la guida al modello del tuo sito.

Per modificare la posizione e la spaziatura dei link di navigazione, modifica la modalità di visualizzazione dell'intestazione del sito sui computer. Puoi anche personalizzare l'aspetto e il posizionamento dell'icona menu sui dispositivi mobili.

In alcuni modelli, puoi modificare la posizione dei link. In Stili sito, cerca i tweak denominati Posizione navigazione, Allineamento navigazione o qualcosa di simile. Per scoprire le posizioni disponibili nel tuo modello, consulta la tabella seguente.

Suggerimento: alcuni modelli supportano la navigazione fissa o "adesiva", che rimane nella stessa posizione nella parte superiore del browser mentre scorri la pagina verso il basso.

Visualizzazione della navigazione in base al modello

Il layout della navigazione del sito dipende dal modello e viene visualizzato in modo diverso sui dispositivi mobili. Sui dispositivi mobili più grandi, come i tablet, possono essere visualizzati gli stili per computer.

Ecco come la Navigazione principale viene visualizzata sui computer nelle seguenti famiglie di modelli:

Modificare la spaziatura dei link

Per modificare lo spazio intorno ai link di navigazione, cerca i tweak in Stili sito che modificano l'intestazione, il banner o la navigazione. Anche se i tweak variano a seconda del modello, i tweak di spaziatura dei link in genere includono parole come Padding, Spaziatura o Larghezza.

Per definire lo stile della navigazione su dispositivi mobili, modifica l'intestazione del sito. Nell'editor dell'intestazione, clicca sull'icona Dispositivo mobile per impostare stili specifici per i dispositivi mobili, inclusi il layout e il tipo di icona menu.

Ricorda:

• I pulsanti di intestazione vengono sempre visualizzati con i link di navigazione dietro il link Menu o l'icona ☰.
• Non è possibile modificare la dimensione del carattere di navigazione sui dispositivi mobili.
• Non è possibile fare in modo che l'icona menu appaia sempre su un computer.
• Per rimuovere l'icona del menu dall'intestazione, assicurati che tutte le pagine si trovino nella sezione Non collegato e disattiva tutti gli elementi dell'intestazione , tranne il carrello della spesa. L'attivazione del carrello non fa apparire l'icona del menu.

In molti casi, la navigazione mobile segue gli stili della visualizzazione su computer per mantenere il branding coerente. Alcuni modelli dispongono di opzioni avanzate di stile su dispositivi mobili, che offrono un miglior livello di controllo. Per maggiori informazioni, consulta la guida del modello.

Per scoprire quali tweak influenzano la navigazione mobile, apri la navigazione nella vista telefono prima di aprire Stili sito:

1. Cambia la Vista dispositivo impostandola su Telefono.
2. Clicca sul link di navigazione (di solito un ☰) in modo da far apparire la navigazione mobile.
3. Nel menu Home, clicca su Sito web, poi su Progettazione e infine su Stili sito. La navigazione mobile rimarrà aperta.

Suggerimento: se non riesci a visualizzare la tua navigazione mobile, assicurati di non aver impostato il colore dello sfondo o dell'intestazione sullo stesso colore del testo di navigazione. I link possono essere visualizzati su questo colore sul cellulare.

Design dell'icona o del link Menu per modello

Ecco come appare l'icona ☰ o il link Menu nelle seguenti famiglie di modelli:

Icone di navigazione mobile vuota

In alcuni modelli, l'icona appare sempre sui dispositivi mobili, anche se tutte le pagine si trovano nella sezione Navigazione nascosta.

Puoi nascondere l'icona Menu nelle seguenti famiglie di modelli:

• Brine family
• Farro family

Apri il pannello Design, quindi fai clic su Stili sito. Scorri la sezione Mobile: Icona menu e imposta la modifica Posizione Icona Menu su Nascondi.

In queste famiglie di modelli, non esiste un sistema integrato per nascondere l'icona di navigazione mobile:

• Bedford
• Forte
• Galapagos
• Montauk
• Wells
• York

Suggerimento: puoi nascondere l'icona di navigazione su dispositivi mobili aggiungendo codice personalizzato. Per maggiori informazioni, vedi questo post nello Squarespace Forum.

Nota: le personalizzazioni del codice non rientrano nell'ambito della nostra assistenza. Ciò significa che non possiamo fornire assistenza in relazione alla configurazione o alla risoluzione dei problemi.