A quick guide to use Gatsby website accessibility widget – All in One Accessibility!

By: Skynet Technologies USA LLC
8 mins
500
Gatsby web accessibility integration

The internet landscape is changing. For website owners, it is essential to deliver an accessible and seamless user experience by ensuring all visitors including people who are blind, hearing or vision impaired, motor impaired, color blind, dyslexia, cognitive & learning impaired, seizure & epileptic, and with ADHD problems; can see, understand, navigate, and easily use Gatsby website conveniently!

Kick-start your efforts into improving website accessibility in a cost-effective way with Gatsby web accessibility installation - an AI based accessibility solution for quick website accessibility improvements. It allows users to select available accessibility features as per their needs and peruse the content. It improves website accessibility for the standards including ADA, WCAG 2.0, WCAG 2.1, WCAG 2.2, Section 508, Australian DDA, European EAA EN 301 549, UK Equality Act (EA), Israeli Standard 5568, California Unruh, Ontario AODA, Canada ACA, German BITV, France RGAA, Brazilian Inclusion Law (LBI 13.146/2015), Spain UNE 139803:2012, Japan JIS X 8341, Italian Stanca Act, Switzerland DDA, and Austrian Web Accessibility Act (WZG)!

To enable All in One Accessibility 10 days free trial, please follow this instructions.

Explore the following steps to integrate All in One Accessibility widget as a part of Gatsby website:

  • To begin, to get to the All in One Accessibility Plugin, Run the below commands in your cmd.

    Run this command to install the plugin “npm install gatsby-plugin-all-in-one-accessibility

    gatsby website accessibility remediation
  • Now Add the given below code in your Project Directory ➝ Gatsby-config.js file

                resolve: `gatsby-plugin-all-in-one-accessibility`, 
    
          options: { 
    
              //Check for license key from https://www.skynettechnologies.com/all-in-one-accessibility 
    
              licenseKey: ``, 
    
              //Enter the color code as per the template/theme used in your website 
    
              colorcode :"cccccc", 
    
              //Enter the position of widget into in your website 
    
              //"top_left" => "Top Left", "top_center" => "Top Center", "top_right" => "Top Right", "middel_left" => "Middle Left", "middel_center" => "Middle Center", "middel_right" => "Middle Right", "bottom_left" => "Bottom Left", "bottom_center" => "Bottom Center", "bottom_right" => "Bottom Right" 
    
              position : "bottom_left", 
    
              //Enter the Icon type 
    
              //aioa-icon-type-1=>"Accessbility Icon", aioa-icon-type-2=>Wheel Chair Icon, aioa-icon-type-3=>"Blind eyes icon 
    
              iconType : "aioa-icon-type-2", 
    
              //Enter the Icon Size 
    
              //aioa-big-icon=>"Big", aioa-medium-icon=>"Medium", aioa-default-icon=>"Default",aioa-small-icon=>"Small",aioa-extra-small-icon=>"Extra Small" 
    
              iconSize : "aioa-default-icon", 
          }
            

Reach out if you need any help with the installation or technical assistance! We’d love to help!

Report a problem

Skynet Technologies is a proud W3C (World Wide Web Consortium) and IAAP (International Association of Accessibility Professionals) member that help us to be a part of the global accessibility community and stay up to date with compliance guidelines.

The businesses, large enterprises, Federal and state governments, educational institutions and universities who are considering remediating websites with full ADA WCAG 2.0, WCAG 2.1, WCAG 2.2 compliance; we provide managed website ADA upgrades including audit, consulting, website remediation, document accessibility remediation, VPAT accessibility conformance report, regular maintenance, monitoring, training, and support.

If you are looking for enterprise or custom web accessibility solutions, request a free WCAG 2.1 compliance fix pricing estimate or email us at [email protected].

151