Som standard er Eye-Able®-hjelpeprogramvaren integrert i et nettsted som et ikon som er fast plassert i forhold til visningsfeltet. Denne fremtredende plasseringen, kombinert med ikoner med høy kontrast, har vist seg å være enkel å bruke i brukertester, selv for brukere med alvorlige synshemminger. Eye-Able® kan imidlertid også enkelt bygges inn direkte i nettstedet. Dette muliggjør integrering i navigasjonslinjen eller andre eksisterende containere.

Som et alternativ til det vanlige ikonet kan et hvilket som helst element på siden brukes. Dette elementet vil da bli koblet til "åpne og lukke"-funksjonene til det vanlige ikonet. Det nye målelementet må opprettes eller endres manuelt!

For å opprette koblingen må CSS-ID-en « eyeAble_customToolOpenerID » legges til det nye målelementet. Når et element med denne ID-en finnes på en side, vil standardlogoen skjules, og en tilsvarende hendelseslytter vil legges til denne hendelsen. Verktøylinjen vil forbli i samme posisjon som den ville vært med den vanlige logoen.

Hvis flere åpne/lukke-knapper skal bygges inn, kan CSS-klassen « eyeAble_customToolOpenerClass » også brukes. Virkemåten er identisk med CSS ID-metoden.

Merk: På alle undersider der det ikke finnes et slikt element med eyeAble_customToolOpenerID ID- eller eyeAble_customToolOpenerClass-klassen , vil den vanlige logoen fortsatt vises!

Hvis Eye-Able skal lenkes til et element på siden uten å skjule hovedlogoen, kan CSS-klassen « eyeAble_customToolOpenerNoHideClass » brukes.

Det er også mulig å åpne Eye-Able-verktøylinjen direkte via en lenke. Bare sett lenkemålet til "javascript:EyeAbleAPI.toggleToolbar()". 

Sørg for at Eye-Able-tilgangspunktet er tilgjengelig via tastaturet og har tekst tilgjengelig for skjermlesere. En mulig etikett ville være: «Åpne programvare for visuell assistanse. Tilgjengelig via tastatur ved bruk av ALT + 1».

For demonstrasjonsformål bruker denne innebyggingen på denne siden følgende logo: