radykal | Support Center Chooser

For which product do you need support?

Fancy Product Designer Multistep Product Configurator

Start a new topic

MSPC - Missing tabindex on accordion, not keyboard accessible

For keyboard users, there's no way for them to tab into the accordion (and probably tabs also) options in the mulitstep product configurator, and make their selection.

The variations need to have tabindex=0 added to them, and also some javascript to activate a click function. I have a custom solution working for these issues, but just need to figure out where in the mspc plugin to add tabindex=0. Any help would be appreciated, thanks.

(194 KB)

1 person likes this idea

Found the file to edit - /inc/class-frontend-product.php - line 239 (plugin version 1.1.3) . Not ideal to edit the core plugin files, but it works. Hope to see this accessibility enhancement added in a future release. The javascript to make the variations clickable via keyboard return key is:

jQuery(document).on('keyup', '.mspc-variation',function(e){

    if(e.which==13 || e.which==32)



How are you showing the colour swatches?

In “Attributes” , select your attribute, then edit its terms, and in each term you can assign an image. Each color is simply a png image. I think there’s probably a setting somewhere in MSPC to have it show the image rather than the text of the attribute...can’t recall right now. If you can’t figure it out, let me know and I’ll look when I’m back at the computer.
Ah that all makes sense! They looked like they were coming from a variations plungin! Did you make them yourself? I need some similar to yours but to different hex codes. If you pulled them from somewhere else and can point me in the right direction that would be much appreciated. Thanks
Login or Signup to post a comment