Disable Bundled Version of Slick?

[GL_creative]

Hi there!

I am using Slick Slider http://kenwheeler.github.io/slick/ on a few of my websites because I really like the way it handles my content. It’s really simple. A js and css file enqueued in my child theme, a couple classes, and a snippet of javascript and it’s done. But the latest version of Pro totally breaks it.

It works on 2.0.4 but on 2.1.6 the content disappears from view and sizing goes haywire. I’ve tried disabling plugins, disabling my enqueued version of Slick, stripping out customizations, etc but no dice. So I’m thinking there’s a conflict with the bundled version of Slick and the one I have enqueued. (Stack being used: Integrity)

The simple solution seems to be to disable the version/files that use Slick that come with Pro to eliminate the conflict. Is that doable? If so, how do I do it? (And if it isn’t, are there any recommendations? I’d prefer not to rebuild my slides in another slide system if possible.)

[ruenel]

Hello There,

Thanks for writing in! In the theme, the post carousel in Ethos is using slick. The slick JS is also loaded along with the x theme files. You may not need to JS/CSS files which you have enqueued in your child theme. Please temporarily disable it and test again.

To better help you with this issue, please provide your url of the site and maybe the WP access as well so that we can take a closer look and see what we can do with your modifications.

Best Regards.

[GL_creative]

On further testing I discovered the following:

I have to have slick css and js enqueued for the slides to work.
Slick slide placed on page works.
Slick slide put inside a modal does not work, styles totally break down and content doesn’t show as expected, but attempting to disable styles and simplify to get a basic slider working doesn’t seem to help much.

I previously used bootstrap3 modals. Disabling bootstrap does not fix the issue. The old modals have a number of issues. I was prepared to abandon those for content area modals but I have to get the slides working inside them first.

Maybe I have too much customization going on. This is a staging copy of the site so it’s safe to build a blank page for experimenting or mess with things as they sit.

[christopher]

Hi, glindacreative,

It seems the conflict is between the lightbox JS library that theme uses and the new version of slick JS which you use in your installation.

Unfortunately, we can not change the lightbox library as it is necessary for the theme to work on different elements. You will need to avoid using the Slider inside the modal, unfortunately.

Thank you for your understanding.

[GL_creative]

Have any of the packaged slider tools like Layer Slider, Slider Revolution, or Soliloquy been tested inside lightbox elements?

Edit of Edit: scratch layerslider from the list.

Also, does the lightbox library have a name or is it strictly customized for X? I may want to approach this from the other side and see if anyone in the Slick user community has any thoughts on addressing the conflict.

[rad]

Hi @glindacreative,

They will not work on any lightbox, those slider tools generate its dimension based on the calculated size of the visible container. And lightbox isn’t, so you need special integration for every lightbox to re-trigger the rendering API of the slider. Hidden elements have zero dimension, the same thing happen when you add a slider on a tab or accordion which originally closed.

There is no universal solution since there is no way to predict the rendering API or trigger of each plugin. It has to be manually applied by a developer as customization. It’s not a conflict but not implemented feature.

Thanks!