Aspetto & Visualizzazione
Tutte le opzioni di questa pagina sono disponibili nella versione Gratuita. Gli utenti Pro ereditano tutto questo e aggiungono funzionalità supplementari (vedi la sezione Funzionalità Pro nella barra laterale).
Accedere alle impostazioni
Tutte le impostazioni si trovano nel menu Barra di avanzamento nella barra laterale del tuo admin WordPress (menu di primo livello, non sotto Impostazioni). Le opzioni di aspetto sono raggruppate nella scheda Stile.
Aspetto della barra
Controlla l'aspetto visivo della barra di avanzamento.
| Opzione | Valori | Predefinito |
|---|---|---|
| Colore della barra | Qualsiasi colore | #1D9E75 |
| Altezza | 2 – 20 px | 4 px |
| Posizione | alto / basso / personalizzato | alto |
| Selettore CSS personalizzato | Qualsiasi selettore CSS | — |
| Sfondo pista | Qualsiasi colore (opzionale) | — |
| Opacità | 10 – 100 % | 100 % |
| Z-index | 1 – 99 999 | 9999 |
| Offset header sticky | auto o 0 – 500 px | auto |
Il Selettore CSS personalizzato ti permette di ancorare la barra a qualsiasi elemento della pagina — utile se vuoi posizionarla appena sotto un header personalizzato invece che sul bordo della finestra.
L'Offset header sticky impedisce alla barra di scomparire dietro gli header fissi. Il valore predefinito auto rileva automaticamente l'altezza dell'header. Se il rilevamento si comporta in modo anomalo sul tuo tema, imposta un valore fisso in pixel.
Controllo della visualizzazione
Controlla dove appare la barra sul tuo sito.
| Opzione | Valori | Predefinito |
|---|---|---|
| Attiva sugli articoli | Attivato / Disattivato | Attivato |
| Attiva sulle pagine | Attivato / Disattivato | Disattivato |
| Nascondi in homepage | Attivato / Disattivato | Attivato |
| Visibilità dispositivo | Tutti / Solo desktop / Solo mobile / Nascondi su mobile | Tutti |
Sorgente di avanzamento
ReadNinja può calcolare l'avanzamento della lettura in due modi diversi.
- Solo contenuto — la barra inizia a riempirsi quando il lettore entra nel corpo dell'articolo e si completa all'ultimo paragrafo. ReadNinja rileva automaticamente i contenitori comuni come
.entry-content,.post-contentearticle. - Pagina intera — la barra riflette lo scroll globale della pagina (dalla cima della finestra fino al fondo del documento).