Crediti fotografici: Any IP Ltd, il link all’autore èhttps://anyip.io/ e Simplex – Web Design Sydney 

Effettuando un controllo autonomo della configurazione, è possibile personalizzare Eye-Able – andando oltre le funzionalità del configuratore – in base al proprio sito web. I vantaggi di tale personalizzazione sono descritti nell’articolo “Quali vantaggi mi offre una personalizzazione iniziale?”. Per effettuare queste personalizzazioni è necessaria una conoscenza avanzata di HTML e CSS. Per ogni sito web offriamo quindi l’opzione di un controllo completo e di un’ottimizzazione di Eye-Able. Alcune possibilità di personalizzazione sono tuttavia disponibili in qualsiasi momento anche per gli utenti non gestiti di Eye-Able. Di seguito vengono presentate le impostazioni disponibili.

Nota: le seguenti configurazioni rappresentano solo una parte dei parametri disponibili in un'ottimizzazione completa effettuata da Eye-Able.

Per estendere la configurazione di Eye-Able, è necessario aggiungere ulteriori coppie chiave-valore alla variabile eyeAble_pluginConfig. Una configurazione di esempio è disponibile qui (https://www.eye-able-cdn.com/example.js)

Oltre all'integrazione diretta della configurazione inline, è possibile apportare modifiche alla configurazione di Eye-Able anche tramite una funzione separata. Per poter apportare autonomamente modifiche alla configurazione, si consiglia quindi di utilizzare il metodo eyeAble_updateConfig():

<script type="text/javascript" >
    function eyeAble_updateConfig() {
        eyeAble_pluginConfig.topPosition = "200px"; //Verändere die Top-Position des Icons
        eyeAble_pluginConfig.maxMagnification = 10;
        if(eyeAble_pluginConfig.blacklistContrast){
            //append to the existing rules, otherwise they get overwritten
            eyeAble_pluginConfig.blacklistContrast += ".myClass";
        } else {
            eyeAble_pluginConfig.blacklistContrast = ".myClass";
        }
    }
</script>

È possibile commentare i parametri che non devono essere modificati.

Ingrandimento:

Sono disponibili i seguenti parametri per limitare l'ingrandimento:

• maxMagnification: [int] Indica l'ingrandimento massimo (valore predefinito: 21)
• maxMobileMagnification: [int] Indica l'ingrandimento massimo su dispositivi mobili (valore predefinito: 3)

Posizione:

Sono disponibili i seguenti parametri per modificare la posizione dell'icona principale:

• topPosition: [String] Imposta la posizione “top” dell’icona sul desktop in % o px (impostazione predefinita: “10%”)
• rightPosition: [String] Imposta la posizione a destra dell'icona sul desktop in px. Se sidePosition è impostato su "left", viene impostata la posizione a sinistra (impostazione predefinita: "10px")
• mobileBottomPosition: [String] Imposta la posizione inferiore dell'icona nella versione mobile in % o px (impostazione predefinita: "15%")
• mobileRightPosition: [String] Imposta la posizione a destra dell'icona nella versione mobile in px (valore predefinito: "10px")
• sidePosition: [String] Imposta il lato in cui appare l'icona: "left" o "right" (impostazione predefinita: "right")

Aspetto:

Per modificare l'aspetto sono disponibili i seguenti parametri:

• mainIconAlt: [ int] Consente di scegliere l'icona principale tra tre varianti: 0, 1 o 2 (impostazione predefinita: 0)
• iconSize: [int] Modifica le dimensioni dell'icona sul desktop; valori consigliati compresi tra 50 e 70 pixel (impostazione predefinita: 70px)
• mobileIconSize: [int] Modifica la dimensione dell'icona su dispositivi mobili; valori consigliati compresi tra 35 e 50 pixel (impostazione predefinita: 50px)

Lettori di schermo:

È possibile modificare le classi CSS di personalizzazione utilizzando i seguenti parametri:

• customSrBlacklistCSS: [String] Modifica la classe CSS degli elementi da escludere (impostazione predefinita: eyeAble_SrSkip)
• customSrStartCSS: [ String] Modifica la classe CSS per il nuovo elemento di avvio (impostazione predefinita: eyeAble_SrStart)
• customSrTextCSS: [String] Modifica la classe CSS del blocco da leggere (impostazione predefinita: eyeAble_SrText)

Escludere elementi dalle funzioni:

I seguenti parametri consentono di escludere determinati elementi dalle funzioni di Eye-Able. Ciò è utile per il testo che, in caso di ingrandimento, fuoriesce dal proprio contenitore, oppure per gli elementi i cui colori non devono essere modificati dalla modalità di contrasto o dalla modalità notturna. Gli elementi possono essere selezionati tramite selettori CSS nativi (maggiori informazioni qui (https://www.w3schools.com/cssref/css_selectors.asp)). I selettori CSS multipli vanno separati da virgole. L’esclusione si applica anche a tutti i figli degli elementi selezionati!

• blacklistContrast: [String] Esclude alcuni elementi dalla regolazione del colore nella modalità Contrasto o Notte.

ad es.

• blacklistFontsize: [String] Esclude gli elementi dall'ingrandimento del carattere

ad es.

• forceWhiteBackground: [ String] Imposta uno sfondo bianco quando è attiva la modalità notturna o quella a contrasto