Stop A Single slide Slider from Sliding

Hi guys - I’m making a site with a slider on the front page which has three slides. Everything works great.

On the rest of the pages of my site I want to display a single slide with a brief description of what’s on the page. To keep things looking the same I’ve used the exact same slider settings, but just with a single slide.

O.K. on to the problem - is there any way of stopping these single slide sliders from sliding on a touchscreen?

If you are interested in the site please do visit- www.lavanyaholistics.co.uk/beaver

Ah, I think I know exactly what you mean. I had a similar issue not too long ago. Unfortunately, no, though, there isn’t a way around that on mobile devices, sorry about that! I would recommend just replacing it with a single image.

Best,
Billy

Any ideas how I could replicate the responsive behaviour of the slider?

Ah, I see that it is a content slider. I think it could be accomplished, just with some fine tuning using BB, the mobile settings, etc. I’ll have to think on that a bit. I thought I had an idea and started writing it out, but then realized that wouldn’t quite work. :slight_smile:

Feel free to do some testing on your own as well. A cool trick with the BB mobile settings is that you can set things to show only at large and medium and then another set of things only on mobile or small devices - almost to replace the first set. That was the thought process anyway, let me see what I can come up with…

Best,
Billy

Well I can certainly replicate the look, but short of duplicating the content I can’t seem to get the same behaviour.

Would there be any milage in adding the slider classes to the columns?

Would Google penalise me for duplicating content on page?

Hey Joseph,

You can override the Content Slider module to add a new option for touchEnabled. To do so, follow the steps below.

  1. Create a new folder in your theme's folder named fl-builder.
  2. Create a new folder within your theme's fl-builder folder named modules.
  3. Copy the module you wish to override from wp-content/plugins/fl-builder/modules to your theme's fl-builder/modules folder.
Then edit the /includes/frontend.js.php file. Just add this line touchEnabled: ($(".fl-content-slider-wrapper > div").length > 1) ? true: false, below the var slider line. After doing so, clear the BB cache and check the mobile slider. Let us know how it goes!

Ben

Thanks for chiming in, Ben!

Amazing - thank you so much, just what I was looking for

One slight error in your process, the directory I had to copy the module from is called wp-content/plugins/bb-plugin/modules

Any chance on getting the touch enabled function on the front end for next release?

Hey Joseph,

The default setting for TouchEnabled is true so we just left it out of the config. Or did you mean having a setting for it on the Content Slider? If so, feel free to add that as a feature request on our User Voice Forums and we’ll see how it goes.

Ben

Yes - having a setting for it would be good. I can see it coming in handy for some multi-slide applications too. Will add it to the User Voice Forum for you.

Vote for this feature here: https://wpbeaverbuilder.uservoice.com/forums/270594-general/suggestions/10336548-have-a-setting-on-the-slider-modules-which-toggles

Hey Joseph,

Thanks! The guys love going there shopping for new ideas to implement. :slight_smile:

Ben