Back to guides

Add our accessibility widget; make Shopify sites more ADA compliant

As a business, you want to make sure your online store is easy to navigate and accessible to all potential customers. But, it can be difficult to thoroughly integrate website accessibility if you’re not an experienced web developer. UserWay’s Shopify widget can help make your site more compliant with ADA regulations and WCAG standards. This plugin provides seamless integration of UserWay’s innovative technology, to move your Shopify website ahead towards correct ADA and WCAG accessibility compliant levels. Adding the accessibility plugin is quick and easy: do it automatically through the Shopify app store, or manually using a unique code.

How to automatically install UserWay’s accessibility plugin from the Shopify app store

Step 1: Find UserWay in the Shopify Store

Search for “UserWay” in the Shopify app store. Select the “UserWay Website Accessibility” option. Then, select “Add app,” followed by “Install app.”

1 - shopify app

2 - add UserWay shopify plugin

Step 2: Check Your Email for Your Credentials

If this is your first time using the UserWay widget, we will send a welcome email to you with your UserWay username, password, and code. You can skip this step and use your login credentials if you already have an account.

Step 3: Upgrade For More Features

This is the app’s default, free version. If you’d like your Shopify website to be more compliant with ADA and WCAG specifications, you can purchase the AI-powered version starting at $49/month by clicking the green “Upgrade Now” button.

Step 4: Enable the Widget

To enable the widget, toggle the On/Off button found below “Configure Your UserWay Widget.”

3 - Enable UserWay widget

Step 5: Customize Your Widget

You can now customize the type, color, size, and position of your UserWay icon. Be sure to click “Save your settings,” or you will lose your customizations.

Step 6: Generate an Accessibility Statement

To generate an accessibility statement, select the “Accessibility Statement” tab found on the blue and white menu bar at the top of the page. Fill in your details and select “Generate My Accessibility Statement.” Check your email inbox, as we will email it to you.

Step 7: Preview Your Website

To double-check that everything has been correctly installed and is working, preview your website by selecting the eye icon in the left menu. Your previewed site should open automatically.  

How to manually install UserWay’s accessibility widget

Step 1: Register Your Website With UserWay

Register your website with UserWay by clicking the “Start Free Trial” icon at the top right of the page and completing the steps to get your unique code. For more information on how to get your code, click here (need link).

Step 2: Receive Your Text Code

For a new website registration, we will email your text code and login credentials to you, but you can also copy your unique code to your clipboard or save it as a text file. If you have already registered a website with UserWay, you can add a new website to your account, which will use the same code issued to you with the first site.

To find your code, go to the top menu of your dashboard at and click “My embed script.” 

Step 3: Paste Your Code

Next, you will want to paste your code into the theme editor. Look for the “Online Store” along the left-side menu and click on “Theme Editor,” then click on “Current Theme,” then “Actions,” then “Duplicate.” This will create a backup copy of your theme. 

1 - Go to online store - themes - Actions - Duplicate

Step 4: Select Your Theme

In your backup theme, select “Edit code,” which will bring up a list of template files. Within this list, select “theme.liquid,” and the file will open on the right side of your screen.

2 - Go to duplicated theme - Actions - Edit code

3 - Click theme-liquid

Step 5: Paste Your Code

Scroll to the end of the code to find the body closing tag </body>. Click on the start of this closing tag and press “Enter” a few times to make space for the new code above it. Paste the code in this space. Don’t forget to save your changes by clicking “Save” in the top right pero of the screen. 

4 - Scroll until body closing tag

5 - Paste code - click save

Step 6: Preview Your Website

Preview your website to confirm that the widget is correctly installed and working. 

UserWay’s accessibility widget adds necessary elements to strengthen your Shopify website’s accessibility, and to bring it up to ADA and WCAG standards. By using this accessibility plugin, you are making your Shopify online store exponentially more compliant, and offering a site that’s more accessible to everyone.



If you need help uninstalling UserWay’s Shopify app, our support team will be happy to help you out. You can contact us directly through Shopify’s chat function.

If you’d like to uninstall UserWay’s Shopify widget by yourself, here’s how:

Step 1: On the left menu of your Shopify Admin page, select “Apps.”

Step 2: Search for “UserWay Website accessibility” in the search section at the center of the page, and click “Delete.”

Step 3: We appreciate your feedback. To provide it, select one of the options from the dropdown menu, followed by “Delete again.”

The easiest way you can make your Shopify store more accessible is by setting options for a high contrast between the background color and the color of your text. For example, gray text on a white background could be difficult to see for people with low vision. Best practice is to have a solid colored background that presents a strong contrast to the text on the page, such as black text on a white background.

Next, it is important that your Shopify site is screen reader compatible. Screen readers announce web page content out loud for blind or visually impaired users. It’s important to make sure your website is compatible with this commonly used technology, so that people using it to access websites like yours can easily navigate through the web pages. Installing UserWay’s accessibility widget can help you make your website accessible and WCAG and ADA-compliant.

Shopify is not ADA compliant by default. Shopify will not check each website to see if it is compliant with ADA or WCAG rules and regulations, and not all of Shopify’s preset options are accessible. Shopify site owners or administrators must take the initiative to make sure that the Shopify store’s content, page design, and functionality are all ADA and WCAG compliant.

If you don’t include digital accessibility measures in your website design, you are preventing people with disabilities from accessing your site. Not only is it the right thing to do to prevent discrimination against people with disabilities, accessibility is also beneficial to your brand. It allows you to be open to all potential customers, and to significantly increase your client base.

Ready to Make Your Shopify Website Accessible?