Alternative mobile slider slow down the page / Two differents sliders at same position doesn't work?

tossn · October 2016

I need alternative sliders on my page for moblie view and for desktop/tablet view (with different photos and text).

So I created two different sliders and put them in two seperate sections of muffin builder page options. One section I set the responsive visibility to "hide on mobile", the other section i set to "hide on desktop tablet. In general it does, what it should do: In mobile view it shows an other slider than in desktop view. Both at the exakt same position.

Problem: In BeTheme it slows down the whole page (and also pages in other browser tabs). It is loading very slow, scrolling isn't smoove at all. Every few seconds you can't do nothing at all, than waiting.

But when I publish both sliders under each other on the same page with no special responsive visibility options (option then is "default"), then all works fine and fast.

What I already did:

1. Testing all troubleshooting suggestions from Revolution Sliders website (ThemePunch). This didn't solve the problem.

2. I switched the theme to "Twenty Sixteen". There I put the two sliders shortcodes in the wordpress editor and a special css for mobile- and desktop-visibility in the css section of Revolution slider. And all work great with the same two sliders - only in an other theme.

3. A bit strange for me: Firefox slows down a lot when I use BeTheme in this case – Safari slows down only a bit. With "Twenty Sixteen" both browsers work perfect.

What can I do that it works also perfect in BeTheme?

Albert · October 2016

Hi,

to be honest, we have no idea what might be the reason because we've tested same thing on our side and everything works fast. However, we have few suggestions:

1. Please switch to default scroll under Theme options > Addons & Plugins > Addons section.

2. Try to use WP Mobile Detect plugin instead of responsive features for section.

3. To speed up website, you can try to use W3 Total Cache plugin.

tossn · October 2016

WP Mobile Detect fixed the problem. It took me two days, but of course thanks a lot for this solution.

For my opinion this says that there is a problem in your content builder or in revolution slider.
Reason: Because all works fine without content builders section option "responsive visibility" and without slider plugin item.

Maybe it is a javascript/jquery problem between BeTheme (here: BeInteractive) and Revolution Slider, that isn't possible to solve with built-in revolution slider troubleshooting options...

I like to give you the following description, what I tested. Maybe is helpfully to you or other BeTheme users to find the problem:

This works fine:

1. I put with WP Mobile Detect
[notphone][rev_slider alias="exampleone"][/notphone]
[phone][rev_slider alias="exampletwo"][/phone]
in BeTheme content builder column

2. I put with WP Mobile Detect
"[notphone][rev_slider alias="exampleone"][/notphone]
[phone][rev_slider alias="exampletwo"][/phone]"
in the wordpress editor

3. I switch to another theme (for ex. "Twenty Sixteen"). There I put the two sliders
shortcodes
"[rev_slider alias="exampleone"][rev_slider alias="exampletwo"]
in the wordpress editor and a special css for mobile- and
desktop-visibility in the css section of Revolution slider (https://www.themepunch.com/faq/alternative-mobile-slider/)

This DOESN'T Work:

1. In BeTheme content builder I create two different sections, each with a slider plugin item. I choose from the slider list of revolution slider in the first item "exampleone" an in the second item "exampletwo". In the Section with first item i put the responsive visibility option to "hide on desktop", section with second item i put it on "hide on desktop & tablet".

2. In BeTheme content builder I create two different sections, each with a column item. In the Section with first column i put the slider
shortcodes "[rev_slider alias="exampleone"]", in the section with the second column "[rev_slider alias="exampletwo"]". In the Section with first column i put the responsive visibility option to
"hide on desktop", section with second column i put it on "hide on
desktop & tablet".

3. In BeTheme I put the two sliders
shortcodes
"[rev_slider alias="exampleone"][rev_slider alias="exampletwo"]
in the content builder editor (in one column item) and a special css for mobile- and
desktop-visibility in the css section of Revolution slider (https://www.themepunch.com/faq/alternative-mobile-slider/)

4. In BeTheme I put the two sliders
shortcodes
"[rev_slider alias="exampleone"][rev_slider alias="exampletwo"]
in the wordpress editor and a special css for mobile- and
desktop-visibility in the css section of Revolution slider (https://www.themepunch.com/faq/alternative-mobile-slider/)

It "doesn't work" means:
In Safari it slows down the page a bit (no fluently scrolling anymore, content is appearing slow), in Firefox it makes working nearly impossible. Directly on the open browser tab, but also on other browser tabs.

All seven possibilities tested with three Macs (from 10.9. to 11.12. each with newest Firefox and Safari) and iPhone 6 (with Safari).
Theme: BeTheme (BeInteractive).
Problem: To have alternative mobile and desktop sliders (with different image size) at same position.

Albert · October 2016

If you will re-create what "does not work" on your side and send us access to that page privately, we will be able to have a look it because we re-created above steps on our end and everything works as should and definitely does not work the way you said.

Alternative mobile slider slow down the page / Two differents sliders at same position doesn't work?

Comments