Contrib.social

Support Accessible Slick

Open on Drupal.org →
Created on 4 February 2021, almost 4 years ago
Updated 16 August 2024, 3 months ago

Currently we are getting more requests that our sites need to comply with WCAG criteria and one of the most problematic features seems to be the sliders.

I noticed that there is an drop in replacement for Slick which has much better support for accessibility at https://github.com/Accessible360/accessible-slick.

The default Slick version seems to be last updated in 1.8.1 and the drop in replacement seems to be in active development.

I tested replacing the original Slick library in the module by installing the Accessible Slick to the same location and then adjusting the library paths like so:

js:
    /libraries/slick/slick/slick.min.js: { weight: -3, minified: true }
  css:
    base:
      /libraries/slick/slick/slick.min.css: {}
      /libraries/slick/slick/accessible-slick-theme.min.css: {}

This gave me 99% the same look as the original slider except for small color changes and the new pause button which needs positioning. Took me around ~2 hours to implement.

Could we add this as an option to the module?

I would suggest that we add the accessible version of Slick as a separate library to the module and when the Accessibility option is checked in the module settings it would load the different library JS files and also add the needed theme files or the accessible skin could be also added as an option to the module which you could select instead of the default one.

Remaining Tasks

Side issues

✨ Feature request
Status

Needs work

Version

3.0

Component

Accessible Slick

Created by

🇫🇮Finland heikkiy Oulu

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • Comment 8 months ago →
    🇮🇩Indonesia gausarts

    3.x is out.

    Any betterment should start here and may or may not be backported later.

    Thank you.

  • Comment 3 months ago →
    🇬🇧United Kingdom williamsona

    Morning, I am using
    Accessible slick library 1.0.1
    Slick library 1.8.0
    Slick 3.0.3
    Slick views 3.0.2
    Blazy 3.0.10
    Core 10.3.1

    These are all upgrades for a slider I have had on my site for 2 years.

    I have a content type Feature which a user adds content to then I have an entityqueue that is used to order the slides. this is all output in a slick view.

    I have selected the accessible slick library and initially everything looks good with my custom optionset. But if I try and make a change to my custom optionset or just save the slick settings page with no changes then my slider breaks.

    In the view settings I change the default optionset to Default then the slider works again (even after a save of slick settings)
    For my current set up this works fine as I can override defaults in the view settings.

    I am currently trying to find out why the view doesn't work with a custom optionset using the accessible slick library but haven't come up with a solution yet.

    Just incase this helps anyone or I am missing some steps?

  • Comment 3 months ago →
    🇬🇧United Kingdom williamsona

    Sorry, ignore #57. I found a setting called "Use group role" in the slick settings and checking this fixed my problem.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024