Standaard is de Eye-Able® assistentiesoftware geïntegreerd in een website als een vast pictogram ten opzichte van de viewport. Deze prominente positie in combinatie met pictogrammen met een hoog contrast heeft in gebruikerstests bewezen gemakkelijk te zijn, zelfs voor gebruikers met ernstige visuele beperkingen. Eye-Able® kan echter ook zonder problemen direct in de website worden geïntegreerd. Dit maakt integratie in de navigatiebalk of andere bestaande containers mogelijk.

Elk element op de pagina kan worden gebruikt als alternatief voor het gewone pictogram. De "open en sluit" functies van het gewone pictogram zijn gekoppeld aan dit element. Het nieuwe doelelement moet hiervoor worden gemaakt of aangepast!

Om de link te maken, moet de CSS ID"eyeAble_customToolOpenerID" worden toegevoegd aan het nieuwe doelelement. Zodra een element met deze ID bestaat op een pagina, wordt het gewone logo verborgen en wordt een overeenkomstige EventListener toegevoegd aan deze gebeurtenis. De positie van de werkbalk is nog steeds waar deze zou zijn met het gewone logo.

Als er meerdere knoppen voor openen/sluiten moeten worden ingesloten, moet de CSS-klasse "eyeAble_customToolOpenerClass" ook worden gebruikt. Het gedrag is identiek aan de CSS ID methode.

Opmerking: op alle subpagina's waarop geen dergelijk element met de ID eyeAble_customToolOpenerID of eyeAble_customToolOpenerClass klasse wordt het gewone logo verder weergegeven!

Als Eye-Able moet worden gekoppeld aan een element op de pagina zonder het hoofdlogo te verbergen, moet de "eyeAble_customToolOpenerNoHideClass"CSS-klasse worden gebruikt.

Het is ook mogelijk om de Eye-Able-werkbalk rechtstreeks via een link te openen. Om dit te doen, stel je gewoon "javascript:EyeAbleAPI.toggleToolbar()" in als het doel van de link . 

Zorg ervoor dat het toegangspunt voor Eye-Able bereikbaar is met het toetsenbord en een tekst heeft die toegankelijk is voor schermlezers. Mogelijke labels zijn: "Open software voor visuele assistentie. Toegankelijk met het toetsenbord via ALT + 1".

Voor demonstratiedoeleinden wordt deze insluiting uitgevoerd op deze pagina met het volgende logo: