Foto Credits: Any IP Ltd, Link naar de auteur is https://anyip.io/ en Simplex - Webdesign Sydney 

Als je de configuratie zelf controleert, kun je Eye-Able - buiten de configurator - aanpassen aan je eigen website. De voordelen van dergelijk maatwerk worden beschreven in het artikel "Wat zijn de voordelen van initieel maatwerk?". Een gevorderde kennis van HTML en CSS is vereist om deze aanpassingen te maken. Daarom bieden we de optie van een volledige controle en optimalisatie van Eye-Able voor elke website. Sommige aanpassingsopties zijn echter op elk moment beschikbaar voor niet-beheerde gebruikers van Eye-Able . De beschikbare instellingen worden hieronder weergegeven.

Opmerking: De volgende configuraties zijn slechts een deelverzameling van de parameters die beschikbaar zijn in een volledige optimalisatie via Eye-Able .

Om de configuratie van Eye-Able uit te breiden, moeten extra sleutelwaardeparen worden toegevoegd aan de eyeAble_pluginConfig variabele. Je kunt hier een voorbeeldconfiguratie vinden(https://www.eye-able-cdn.com/example.js)

Naast het direct inline integreren van de config, kunnen wijzigingen in de Eye-Able configuratie ook via een aparte functie worden doorgevoerd. De methode via de eyeAble_updateConfig() methodewordt daarom aanbevolen om zelf wijzigingen in de configuratie te kunnen aanbrengen:

<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>

Je kunt parameters die niet gewijzigd mogen worden, uitcommentariëren.

Vergroting:

De volgende parameters beperken de vergroting:

• maxMagnification: [int] Beschrijft de maximale vergroting (standaard: 21)
• maxMobileMagnification: [int] Beschrijft de maximale mobiele vergroting (standaard: 3)

Positie:

De volgende parameters bestaan om de positie van het hoofdpictogram te wijzigen:

• topPosition: [String] Stelt de bovenste positie van het pictogram op het bureaublad in % of px in (standaard: "10%").
• rightPosition: [String] Stelt de rechterpositie van het pictogram op het bureaublad in px in. Als sidePosition is ingesteld op "left", wordt de linkerpositie ingesteld (standaard: "10px").
• mobileBottomPosition: [String] Stelt de onderste positie van het mobiele pictogram in % of px in (standaard: "15%").
• mobileRightPosition: [String] Stelt de rechterpositie van het mobiele pictogram in px in (standaard: "10px").
• sidePosition: [String] Stelt in aan welke kant het pictogram verschijnt "links" of "rechts" (standaard: "rechts")

Uiterlijk:

De volgende parameters bestaan om het uiterlijk te veranderen:

• mainIconAlt: [int] Verander het hoofdpictogram tussen drie varianten 0, 1 of 2 (standaard: 0)
• iconSize: [int] Verander de grootte van het pictogram op het bureaublad, aanbevolen waarden tussen 50-70 pixels (standaard: 70px)
• mobileIconSize: [int] Verander de grootte van het mobiele pictogram, aanbevolen waarden tussen 35-50 pixels (standaard: 50px)

Schermlezer:

De CSS-klassen voor aanpassing kunnen worden gewijzigd met de volgende parameters:

• customSrBlacklistCSS: [String] Wijzigt de CSS-klasse voor de elementen die moeten worden uitgesloten (standaard: eyeAble_SrSkip)
• customSrStartCSS: [String] Wijzigt de CSS-klasse voor het nieuwe startelement (standaard: eyeAble_SrStart)
• aangepasteSrTekstCSS: [String] Wijzigt de CSS-klasse voor het blok dat moet worden voorgelezen (standaard: eyeAble_SrText )

Elementen uitsluiten van functies:

De volgende parameters kunnen worden gebruikt om bepaalde elementen uit te sluiten van de functies van Eye-Able . Dit is handig voor tekst die uit zijn container breekt wanneer deze wordt vergroot, of voor elementen waarvan de kleuren niet mogen worden aangepast door de contrast- of nachtmodus. Elementen kunnen worden geselecteerd via eigen CSS-selectors (meer informatie hier(https://www.w3schools.com/cssref/css_selectors.asp). Meerdere CSS selectors worden gescheiden door komma's. De uitzondering geldt ook voor alle kinderen van geselecteerde elementen!

• blacklistContrast: [String] Sluit elementen uit van de kleuraanpassing van de contrast- of nachtmodus.

bijv.

• blacklistFontsize: [String] Sluit elementen uit van de vergroting van het lettertype

bijv.

 

• forceWhiteBackground: [String] Forceert een witte achtergrond wanneer de nacht- of contrastmodus is geactiveerd