ADA WCAG Compliance

Hi @rholzler

Our plugin only provides the ability to add tabs. It doesn’t define or change the way the tabs look. We don’t add any HTML or CSS to a site that could change tab layout and style.

The way the tabs look is defined by your theme and WooCommerce itself. You should submit a ticket with your theme developer and they may be able to help you with focus styles.

Thank you.
-Tracy`

This isn’t about changing the way tabs look.

When a tab is clicked, you need to have a piece of javascript that changes the focus of the browser to the newly displayed content in order to meet the legal requirements set by the U.S. ADA WCAG regulations.

You already have the script changing the class, visibility, and display of the tab’s content; you just need to add a couple of lines of code to focus the browser on that same content.

Thanks,
RHolzler

Hi @rholzler

I understand what you are asking for, but our plugin does not enqueue ANY JavaScript files or CSS files on the front end of a site. The script you are referring to is either coming from WooCommerce or the theme (or a combination of the two).

You should submit a ticket with your theme developer and they may be able to help you.

Thank you.
-Tracy`

So, are you saying that you are not able to modify your plugin to comply with the U.S. Federal ADA Compliance standards by adding a simple onclick focus() JS function to your plugin?

It should be as simple as adding an onclick event to the HREF like this:

<a href="#[TAB_ID_HERE]">[TAB_TITLE_HERE]</a>

With a JS script like this:

focusMethod = function getFocus() {
  document.getElementById("[TAB_ID_HERE]").focus();
}

If that is not possible, could you provide a sample functions.php code snippet to target and customize your tab links so we can do it without altering the source code of your plugin?

• This reply was modified 2 years, 5 months ago by rholzler.

Hi @rholzler

What I am saying is there is nothing in our plugin to modify.

Our plugin DOES NOT enqueue any JavaScript files on the front end of a web site.

Everything you are describing either comes from your theme or WooCommerce itself. Tabs are default WooCommerce functionality, our plugin extends that functionality to create new tabs. The way they look, function, etc. is controlled by WooCommerce. Often a theme will change the way the tabs look or behave so that is in the mix as well.

You need to send this to your theme developer:

It should be as simple as adding an onclick event to the HREF like this:

<a href="#[TAB_ID_HERE]">[TAB_TITLE_HERE]</a>

With a JS script like this:

focusMethod = function getFocus() {
  document.getElementById("[TAB_ID_HERE]").focus();
}

We can’t do this via our plugin because our plugin does not add ANY JS to the front end of a site.

Please confirm you understand.

Thank you.
-Tracy