Quando passiamo gran parte del nostro tempo davanti agli schermi, non c’è da stupirsi che la dark mode (che è più rilassante per gli occhi) stia diventando sempre più popolare . Nota anche come modalità notturna, questa funzione può fornire numerosi vantaggi a te e ai visitatori del tuo sito.
Fortunatamente, l’aggiunta della dark mode al tuo sito WordPress è un processo relativamente semplice. Puoi regolare il modo in cui il tuo sito web appare agli utenti, ma puoi anche cambiare la dashboard di amministrazione con un tema scuro per dare una pausa rilassante ai tuoi occhi.
In questo articolo, vedremo cos’è la modalità notturna e i vantaggi del suo utilizzo. Quindi ti mostreremo come aggiungere la dark mode al tuo sito WordPress e come abilitarla per la dashboard di amministrazione.
Iniziamo!
Cos’è la dark mode? A cosa serve la dark mode?
La modalità scura è un’impostazione di visualizzazione che modifica un sito web in uno schema di colori chiaro su scuro. Questa regolazione riduce la quantità di luce bianca proveniente dallo schermo, il che può ridurre l’affaticamento degli occhi, soprattutto se guardi lo schermo la sera. Le persone che preferiscono la navigazione in dark mode possono abilitare l’opzione tramite un’impostazione sui propri dispositivi o tramite estensioni.
Vantaggi della dark mode
- Luce bianca dagli schermi ridotta
- Minore consumo di energia e maggiore durata della batteria dei dispositivi
- Meno sforzo per gli occhi
- Maggiore tempo trascorso sulla pagina
Come gestore di un sito web, potresti prendere in considerazione l’aggiunta della funzionalità dark mode. L’installazione di un plugin WordPress dark mode può semplificare l’operazione e darti un maggiore controllo sull’aspetto e l’usabilità del tuo sito.
Prima di iniziare, vogliamo fare una piccola precisazione sulla differenza tra la dark mode e la modalità notturna. La modalità dark implica il passaggio dello sfondo dell’interfaccia utente (UI) a una tonalità più scura, mentre la modalità notturna consiste nel cambiare il colore emesso dallo schermo.
Tuttavia, entrambi possono aiutare a ridurre l’affaticamento degli occhi e spesso si usano i termini in modo intercambiabile. Detto questo, diamo un’occhiata a come puoi aggiungere la dark mode al tuo sito WordPress.
Come aggiungere la modalità dark al tuo sito WordPress
Ora che abbiamo visto perché dovresti aggiungere la dark mode al tuo sito web, ti mostreremo come aggiungere e impostare questa modalità. Sebbene sia possibile passare a un tema WordPress con la dark mode, è molto più semplice utilizzare un plugin.
Passaggio 1: installa il plugin WP Dark Mode
Sono disponibili numerosi plugin per WordPress per la modalità dark. Quello che useremo è WP Dark Mode, un plugin freemium che ti consente di creare rapidamente una versione a sfondo scuro del tuo sito web. Non dovrai gestire alcun codice o impostazioni complicate.
Puoi cercare e installare questo strumento nella directory dei plugin di WordPress . Per iniziare, dalla dashboard dell’amministratore, vai a Plugin> Aggiungi nuovo e cerca WP Dark Mode:
Fai clic sul pulsante Installa ora , seguito da Attiva . Questo ti porterà alla pagina delle impostazioni del plugin.
Passaggio 2: attiva la dark mode
La scheda Impostazioni generali è dove puoi attivare e disattivare la modalità notturna. Quando installi per la prima volta il plugin, vedrai che Enable frontend darkmode e Enable OS Aware dark mode sono attivate per impostazione predefinita:
Enable frontend darkmode significa semplicemente che la dark mode è abilitata per il tuo sito WordPress. Gli utenti potranno cliccare su un interruttore per attivare la combinazione di colori più scuri. Enable OS Aware dark mode significa che se un visitatore ha impostato il proprio dispositivo in dark mode, vedrà automaticamente la versione scura del tuo sito web.
Potresti anche voler rendere la modalità dark l’impostazione predefinita per il tuo sito web. Puoi farlo dal menu delle impostazioni e vedere se ti piace. Tieni presente che i visitatori potranno comunque disattivare la dark mode utilizzando il pulsante selettore.
Passaggio 3: abilitare l’interruttore mobile
Successivamente, in General settings , puoi attivare l’ opzione Show Floating Switch . In questo modo verrà posizionato un pulsante sul front-end del tuo sito web, in modo che gli utenti possano attivare o disattivare la dark mode come preferiscono.
Di seguito è riportato un esempio di come apparirebbe il pulsante della modalità scura sul front-end di un sito web, posizionato nell’angolo in basso a destra:
È possibile modificare lo stile e la posizione dell’icona nella scheda Switch settings . Tieni presente che le opzioni sono limitate con la versione gratuita del plugin:
Puoi scegliere se desideri inserire del testo sul pulsante, nonché decidere la sua posizione nella pagina.
Passaggio 4: personalizza i colori della modalità dark
Infine, potresti voler sperimentare con diversi colori in modalità scura. Troverai le opzioni nella scheda Color settings dopo aver attivato l’opzione want to use color presets :
In questa schermata puoi selezionare i colori adatti al brand del sito. Ancora una volta, le opzioni sono limitate nella versione gratuita del plugin. Se scegli di aggiornare, puoi utilizzare una tavolozza di colori preimpostata o crearne una tua.
Come abilitare la dark mode sulla dashboard di amministrazione di WordPress
Mentre abiliti questa funzione per il front-end del tuo sito, potresti voler applicare un tema dark mode di WordPress anche alla dashboard di amministrazione. Le combinazioni di colori e le impostazioni predefinite di WP non favoriscono la riduzione della luce bianca, quindi dovrai utilizzare il plugin per farlo.
Passaggio 1: installa il plugin WP Dark Mode
WP Dark Mode include anche opzioni per il back-end del tuo sito web. Se non l’hai già installato, puoi trovarlo nella directory dei plugin di WordPress. Una volta scaricato e attivato il plugin, ti invierà alla schermata Impostazioni generali .
Passaggio 2: abilita la modalità notturna nel backend
Successivamente, dovrai abilitare la dark mode del backend. Per farlo, vai su Impostazioni> WP dark mode> General settings , quindi attiva Enable dark mode backend :
Scorri verso il basso e fai clic sul pulsante Salva impostazioni per confermare le modifiche.
Passaggio 3: alterna la dashboard di amministrazione da chiaro a scuro
Ora vedrai un nuovo interruttore nella parte superiore dello schermo che ti consentirà di attivare un tema scuro per l’amministratore di WordPress:
Se il tuo sito ha più utenti, ognuno di loro sarà in grado di attivare o disattivare la dark mode in modo indipendente.
Passaggio 4: regola la combinazione di colori dell’amministrazione in modo che corrisponda alla modalità scura
Ora che hai attivato la modalitò ark, potresti voler regolare la combinazione di colori dell’amministratore. Inizia accedendo a Utenti> Profilo .
Da qui puoi selezionare la tavolozza che preferisci:
Una volta selezionati i colori, scorri verso il basso e fai clic sul pulsante Aggiorna profilo per salvare le nuove impostazioni.
Conclusione
L’aggiunta della dark mode al tuo sito WordPress può avvantaggiare te e i tuoi utenti. Se desideri ridurre l’affaticamento degli occhi o preferisci semplicemente un aspetto più scuro, vale la pena aggiungere la modalità notturna.
In questo articolo, abbiamo esaminato cos’è la dark mode e alcuni dei suoi vantaggi. Quindi ti abbiamo mostrato come utilizzare il plugin WP Dark Mode per aggiungere questa funzionalità al tuo sito web e al dashboard di amministrazione.
Buon lavoro!
