Nota: Sebbene le nostre guide più popolari siano state tradotte in italiano, alcune guide sono disponibili solo in inglese.

Modificare i colori

Che tu preferisca un tema in bianco e nero o combinazioni di colori audaci, puoi utilizzare il riquadro Stili sito per regolare i colori per il testo, le linee e le aree di sfondo del tuo sito.

Questa guida offre una panoramica su come regolare i colori per i diversi elementi del sito.

Nota: le Pagina di copertina hanno le proprie opzioni di stile.
Questa procedura si riferisce alla versione 7.0. Se il tuo sito è in versione 7.1, puoi ricevere assistenza consultando le opzioni di stile e design per la versione 7.1.

Guarda un video

Prima di iniziare

  • Le modifiche di colore si applicano a tutto il sito, pertanto la modifica del colore per un elemento di una pagina, ad esempio il corpo del testo, comporterà la modifica in tutte le altre.
  • Per modificare il colore di una sezione di testo specifica, come una singola parola in una frase, utilizza un Blocco Markdown.
  • Ogni tweak di colore deve essere regolato singolarmente.
  • Le modifiche al colore non vengono trasferite quando cambi modello, ma appaiono nuovamente se torni al modello iniziale.
  • All'interno del riquadro Stili sito non esiste un modo per regolare i colori per una pagina singola o un blocco singolo. Se hai esperienza di programmazione, puoi provare a effettuare la modifica con il CSS. Considera solo che non offriamo supporto per modifiche avanzate come questa.

Step 1 - Selezionare una pagina

Per prima cosa, vai alla pagina in cui desideri visualizzare le modifiche. Nel Menu Home, clicca su Pagine. Quindi clicca sulla pagina con i colori che desideri modificare.

Ci sono due motivi per aprire prima una pagina:

  1. Alcuni tweak vengono visualizzati solo quando ti trovi su una pagina che influenzano. Ad esempio, la tua Pagina del blog potrebbe avere tweak specifici per il titolo, che sono visualizzati solo nel riquadro Stili sito quando visualizzi in anteprima un Pagina del blog.
  2. Sebbene le modifiche allo stile verranno applicate a tutto il sito, puoi visualizzarne l'anteprima nella pagina selezionata mentre vengono apportate.

Dopo aver selezionato la pagina corretta nel riquadro Pagine, torna alMenu Home. Da lì, clicca su Designe quindi su Stili sito.

Step 2 - Trovare un tweak di colore

I tweak di stile specifici dipendono dal modello. Scorri verso il basso all'interno di Stili sito per vedere tutti i tweak disponibili sulla pagina che stai visualizzando.

Ogni tweak di colore ha un cerchio accanto all'etichetta. Questo cerchio mostra il colore attuale per un determinato elemento.

Nota: il cerchio non sarà visualizzato se il colore è trasparente o se è lo stesso grigio dello sfondo del riquadro Stili sito.

 

Per trovare opzioni di stile specifiche per un elemento nella pagina, fare clic sull'elemento per vederlo in anteprima. Gli Stili sito mostreranno solo le opzioni di stile per quell'elemento e nasconderà il resto. Questa funzione è disponibile nella maggior parte dei modelli e delle aree del sito. Fai clic su Mostra tutto per visualizzare nuovamente tutte le opzioni di stile per la pagina.

Una volta trovato il tweak, clicca per aprire il selettore di colori.

Step 3 - Scegliere un colore

Utilizza il selettore di colore che si apre per trovare il colore desiderato. Usa il cursore per scegliere il colore e regolare la tonalità (chiaro/scuro) facendo clic sul quadrato nel mezzo.

color-sliders.png

In alternativa, se conosci il valore del colore desiderato, puoi inserirlo nel campo valore. Il campo valore accetta uno dei seguenti formati:

  • HEX - Esempio: #FFFFFF
  • RGB o RGBa - Esempio: rgba(255, 0, 149, 1)
  • HSL/HSLA - Esempio: hsla(325, 100%, 50%, 1)
  • HTML (deve essere minuscolo) - Esempio: white (il linguaggio HTML accetta il nome dei colori solo in inglese)

Per informazioni su come trovare il valore di un colore specifico, puoi visitare siti esterni quali color-hex.com o imagecolorpicker.com.

Suggerimento: il campo del valore si riempie automaticamente quando utilizzi il cursore del colore per trovare un colore. Puoi copiare e incollare questo codice per aggiungere lo stesso colore agli altri tweak in Stili sito.

value-field.png

Step 4 - Modificare la trasparenza

Per regolare la trasparenza di un colore, usa il cursore di opacità trascinando il cerchio sotto il selettore di colore. Sul lato sinistro si avrà un colore completamente trasparente, mentre sul lato destro sarà totalmente opaco.

change-the-opacity.png

Nota: alcuni tweak di colore non includono un cursore di opacità.

Il cursore di opacità è particolarmente utile per i colori di sovrapposizione, che vengono visualizzati sulle immagini.

overlay-opacity.png

Se è presente un colore o un'immagine che si sovrappone con altri, la trasparenza del livello superiore consente di mantenere visibile il livello inferiore.

opacity-overlap.png

Step 5 - Completare e salvare

Clicca in un punto qualsiasi all'esterno della finestra dei colori per chiudere il selettore di colore.
 
Per annullare qualsiasi modifica prima di salvare, clicca sull'icona di annullamento nella parte superiore del pannello o clicca sul punto accanto a un tweak specifico. Vedi Apportare modifiche di stile per ulteriori informazioni.

undo_and_dot_icons.jpg

Al termine delle modifiche, clicca su Salva.

click_save.jpg

Questo articolo ti è stato utile?
Utenti che ritengono sia utile: 60 su 175