Crédits photo : Any IP Ltd, lien vers l'auteur :https://anyip.io/ et Simplex – Web Design Sydney 

En effectuant vous-même une vérification de la configuration, vous pouvez personnaliser Eye-Able – au-delà des possibilités offertes par le configurateur – en fonction de votre propre site web. Les avantages d’une telle personnalisation sont décrits dans l’article « Quels sont les avantages d’une personnalisation initiale ? ». Pour effectuer ces ajustements, une connaissance approfondie du HTML et du CSS est nécessaire. C’est pourquoi nous proposons, pour chaque site web, une option de vérification et d’optimisation complètes d’Eye-Able. Certaines possibilités de personnalisation sont toutefois accessibles à tout moment pour les utilisateurs non gérés d’Eye-Able. Les paramètres disponibles sont présentés ci-dessous.

Remarque : les configurations suivantes ne constituent qu'un sous-ensemble des paramètres disponibles dans le cadre d'une optimisation complète réalisée par Eye-Able.

Pour étendre la configuration d'Eye-Able, il faut ajouter d'autres paires clé-valeur à la variable eyeAble_pluginConfig. Vous trouverez un exemple de configuration ici (https://www.eye-able-cdn.com/example.js)

Outre l'intégration directe de la configuration en ligne, les modifications de la configuration Eye-Able peuvent également être effectuées via une fonction distincte. Pour pouvoir apporter vous-même des modifications à la configuration, il est donc recommandé d'utiliser la méthode 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>

Vous pouvez mettre en commentaire les paramètres que vous ne souhaitez pas modifier.

Agrandissement :

Les paramètres suivants permettent de limiter le grossissement :

• maxMagnification: [int] Définit le grossissement maximal (valeur par défaut : 21)
• maxMobileMagnification: [int] Définit le grossissement maximal sur mobile (valeur par défaut : 3)

Poste:

Les paramètres suivants permettent de modifier la position de l'icône principale :

• topPosition : [chaîne de caractères] Définit la position horizontale de l'icône sur le bureau en % ou en px (valeur par défaut : « 10 % »)
• rightPosition : [chaîne de caractères] Définit la position à droite de l'icône sur le bureau en px. Si sidePosition est défini sur « left », la position à gauche est définie (valeur par défaut : « 10px »)
• mobileBottomPosition: [chaîne de caractères] Définit la position inférieure de l'icône sur mobile en % ou en px (valeur par défaut : « 15 % »)
• mobileRightPosition: [chaîne de caractères] Définit la position à droite de l'icône mobile en px (valeur par défaut : « 10px »)
• sidePosition: [chaîne de caractères] Définit le côté où l'icône apparaît : « left » ou « right » (par défaut : « right »)

Aspect :

Les paramètres suivants permettent de modifier l'apparence :

• mainIconAlt : [ int] Permet de choisir l'icône principale parmi trois variantes : 0, 1 ou 2 (par défaut : 0)
• iconSize : [int] Modifie la taille de l'icône sur le bureau ; valeurs recommandées : entre 50 et 70 pixels (par défaut : 70 px)
• mobileIconSize : [int] Modifie la taille de l'icône sur mobile ; valeurs recommandées : entre 35 et 50 pixels (par défaut : 50 px)

Lecteurs d'écran :

Les paramètres suivants permettent de modifier les classes CSS de personnalisation :

• customSrBlacklistCSS : [chaîne de caractères] Modifie la classe CSS des éléments à exclure (par défaut : eyeAble_SrSkip)
• customSrStartCSS : [ chaîne de caractères] Modifie la classe CSS du nouvel élément de démarrage (par défaut : eyeAble_SrStart)
• customSrTextCSS : [chaîne de caractères] Modifie la classe CSS du bloc à lire (par défaut : eyeAble_SrText)

Exclure des éléments de fonctions :

Les paramètres suivants permettent d'exclure certains éléments des fonctions d'Eye-Able. Cela s'avère utile pour le texte qui déborde de son conteneur lors de l'agrandissement, ou pour les éléments dont les couleurs ne doivent pas être modifiées par le mode contraste ou le mode nuit. Les éléments peuvent être sélectionnés à l'aide de sélecteurs CSS natifs (plus d'informations ici (https://www.w3schools.com/cssref/css_selectors.asp)). Les différents sélecteurs CSS sont séparés par des virgules. L'exclusion s'applique également à tous les éléments enfants des éléments sélectionnés !

• blacklistContrast: [chaîne de caractères] Exclut certains éléments de l'ajustement des couleurs en mode contraste ou en mode nuit.

par exemple

• blacklistFontsize: [Chaîne] Exclure certains éléments de l'agrandissement de la police

par exemple

• forceWhiteBackground : [ String] Impose un fond blanc lorsque le mode nuit ou le mode contraste est activé