Back to guides

UserWay’s Accessibility Widget HTML Installation Guide

Welcome to UserWay’s installation guide: here’s how you can get our accessibility widget on your HTML website. We’ll help you make your website more accessible with just a few steps.

Step 1: Register Your Website Now to Get Started

If you haven’t done so already, you’ll need to register your website with UserWay by clicking the top right corner of the page at UserWay.org. You can skip this step if you have already registered a website with UserWay. 

Step 2: Easily Access Your UserWay Code

You will see your unique code once you complete the registration steps. Be sure to save this text on your computer for later.

If you have already registered a website with us, you don’t need a new code: you can use the one you already have.

If you need to access your code later, you can find it in the welcome email you will receive from us after you sign up. You can also find the code by signing into the UserWay dashboard at UserWay.com. You will see “Embed Code” on the top menu; you can copy it from there.

Step 3: Open All the HTML Pages On Your Site

Now, check where you have your site files saved. Go to the root folder of your site, and open the HTML files. Start with the files called something like index.html or services.html or about-us.html. Open the first file using a plain text editor program, such as Notepad ++.

Place your unique code into each one of your HTML files so that the widget is available everywhere on your site.

NOTE: In order to make the widget appear everywhere on your site, you will need to make sure that you place your unique code on each and every one of your HTML files in the root folder. This must be done page by page.

Open an HTML file in the root folder by clicking on the file’s icon or name.

Step 4: Copy and Paste Your Code

Once you have the HTML file open, go to your site’s <head> tag.

Add in the embed code as the first entry in the <head> tag. To add the embed code, put your cursor right next to the <head> tag, and click Enter once. 

Now, paste your code into the tag using the following keys: Control + V or Command + V. You can also access the Paste command on the top menu under “Edit”.

Step 5: Save File with Keyboard Shortcut

Once your unique code is pasted into the <header> tag of your HTML file, save the changes in your file by clicking Control + S or Command + S on your keyboard. Or, you can go to the top menu under “File”, and click “Save“.

Step 6: Repeat Steps to Enable Widget, Then Preview Website

Repeat these steps with the rest of your site’s HTML files.

Preview your site to make sure you have the widget installed correctly.

Step 7: Upload Site to Server to Activate Accessibility Widget

Remember to upload your site to the server using File Transfer protocol (FTP) to put your changes into effect.

You’re all set! You now have access to UserWay’s accessibility widget on your site. Your site can be navigated and enjoyed by a wider audience, and you are one step closer to becoming fully ADA compliant.

FAQ

Where can I find my unique code if I have already registered a website with UserWay?

You can find your unique code in two places: 1, in the welcome email sent to you by UserWay when you registered, or 2, at UserWay.com. Sign into your UserWay dashboard and look in the top menu for “Embed Script.” This is your unique code for all of your websites.

What happens if I don’t embed my unique code into each page of my website?

Without the unique UserWay code, pages cannot use the widget. Take the time to embed your code on each page of your site to provide better access to your website.

Where can I customize my widget options, like the button style and location on the page?

If you’d like to customize your widget options, you can go to the UserWay.org management console and check your dashboard. Some widget customization options are also available directly in the widget settings as well.

I’m on the free version of the widget, is there an upgrade option?

If you’re still using the free widget, you may want to consider moving ahead to the more robust UserWay AI-Powered Pro Widget. For more extensive accessibility and compliance options, as well as language options, you can upgrade on this page.

Ready to Make Your HTML Website Accessible?