Introduction

As required in various locations throughout the United States, websites need to include a tool to make the website ADA compliant. One tool that can be used is a UserWay widget.

 

*IMPORTANT: Please consult your legal resources regarding requirements for full compliance. This article simply outlines how to embed the UserWay widget but this may not bring your website to full compliance.

 

Summary

• Obtaining the Code
• Adding the Code
  • Original CMS
  • New CMS
• Adding an Accessibility Statement (Optional) 

 

Obtaining the Code

The first step is to get the code. Navigate to https://userway.org/ and select the blue "Get the Widget" button:

Enter your website URL and select the checkbox to agree to the terms of use, etc. Click on the blue "Next" button. 

Provide your first and last name and email address and then click on the blue "Next" button.

Select the ADA icon display style that you would like to use on your website. Click the blue "Next" button to continue. 

Choose the button size and then click on "Next":

Choose the color for the accessibility button and then click "Next":

Choose where you would like the accessibility button to appear on your website. Keep in mind that you will want to have it avoid any other pop-ups (chat box, etc.) on your website. You may consider putting it into the bottom-left to avoid any issues here.

Choose the widget's language or leave it on auto-detect:

Choose "No / I don't know" for Step 8 and then hit the blue "Next" button:

For now, choose the "Free Widget" on the left side:

You will be taken to the page that says "Almost Done!" Do not close this page yet and do not click on "Let's Verify" yet. To install the code, you need to go to the next section of this article.

 

Adding the Code

The instructions for this section will depend on whether you use the Original CMS or the New CMS. If you do not know what version you are on, see CMS Tool Versions (Original CMS vs. New CMS). Follow the specific instructions for your current version of the CMS Tool. 

• Original CMS
• New CMS

*IMPORTANT: Keep in mind that if you ever edit the widget (style, size, etc.) on https://userway.org/, you will have to copy the new code and repeat the steps below--it will not update automatically. 

 

Original CMS

Copy the "Basic Script" only by clicking on the "Copy" button and then continue with the steps for "Adding the Code" that follow. 

Navigate to the CMS Tool > Settings > General > Site Special Script. Paste the copied code into the field and click the blue "Save" button:

Be sure to publish the changes to your live site by clicking the "Publish" button in the top-right. It might take a few minutes to take effect but you should be able to go to your website and see the widget live:

 

New CMS

Make sure you have the basic code copied from the steps you followed on https://userway.org/  and then navigate to the CMS Tool > Settings > Tools > Custom Style & Script:

Copy the following code and paste it into the "Script" field above.

 

Util.addScript("https://cdn.userway.org/widget.js"); let a = document.getElementsByTagName("script"); for(let i = 0 ;i<a.length;i++ ) { if(a[i].src=='https://cdn.userway.org/widget.js') { a[i].setAttribute("data-account","zjPqsYM1jN"); } }

The final step is to replace a certain part of that code so that it grabs your widget. You will need to replace the part that says "zjPqsYM1jN"

You will replace it with your account code that is found here:

Be sure to publish the changes to your live site by clicking the "Publish" button in the top-right. It might take a few minutes to take effect but you should be able to go to your website and see the widget live:

 

Adding an Accessibility Statement (Optional)

This step is optional, but if you need to add an accessibility statement to the footer of your website, you can follow the steps in this section to do so.

This will take place after copying the code above and installing it. You will click on the blue "Let's Verify" button:

You should see a confirmation message that looks like this. You will want to click on the blue "Next" button:

You will then be presented with a page that looks like this:

 

You can then download it as HTML or copy the HTML directly from this page and then you can create a custom page via the CMS Tool and make it /accessibility as suggested by https://userway.org/. You can customize this as you see fit. If you do not want that page to appear on your navigation, you can hide it from the navigation and then simply reference it as a disclaimer in the footer, etc. 

With the New CMS Tool, you can customize the disclaimer in the footer on your own (see the end of the article on Footer). With the Original CMS, you will need to submit a request to the Support Team (support@chimeinc.com) to help add this as a disclaimer link in the footer.

 

Questions?

If you have any questions regarding this topic or any others, please reach out to our Support Team via email at <support@chimeinc.com> or by phone at 1 (855) 981-7557.