Wordpress slider plugin Layer does not work

I have a slider plugin called Layer in my wordpress site (www.amstar.in). The plugin does not work when the site is behind Cloudflare. Anyone has experience with this or similar issue? I turned off the redirection in DNS and the plugin works fine.

Assuming this is JavaScript, do you have Rocket Loader enabled or disabled?

Where can I find that?

Under speed

Its turned on.

Try disabling it and check if the error stil occurs.

Turning off Rocket Loader works. Thanks a log :slight_smile:

@b.tiru.naidu the issue here is your code for the layer slider is telling Rocket Loader to skip optimising the slider’s scripts:

<script data-cfasync="false" type="text/javascript">var lsjQuery = jQuery;</script><script data-cfasync="false" type="text/javascript" src="http://www.amstar.in/wp-content/plugins/LayerSlider/static/js/layerslider.kreaturamedia.jquery.js?ver=5.6.9"></script>
<script data-cfasync="false" type="text/javascript" src="http://www.amstar.in/wp-content/plugins/LayerSlider/static/js/greensock.js?ver=1.11.8"></script>
<script data-cfasync="false" type="text/javascript">
lsjQuery(document).ready(function() {
if(typeof lsjQuery.fn.layerSlider == "undefined") { lsShowNotice('layerslider_4','jquery'); }
else {
lsjQuery("#layerslider_4").layerSlider({hoverPrevNext: false, autoPlayVideos: false, imgPreload: false, lazyLoad: false, skinsPath: 'https://www.amstar.in/wp-content/plugins/LayerSlider/static/skins/'})
}
});
</script>

You can see data-cfasync="false" on each of these script tags here - this is used to tell Rocket Loader not to optimise the loading of that specific script:

https://support.cloudflare.com/hc/en-us/articles/200169436-How-can-I-have-Rocket-Loader-ignore-specific-JavaScripts-

The scripts you have asked us to ignore all have a dependency on jQuery which you have included further up the page in your HTML and allowed Rocket Loader to optimise. This means when the layer slider scripts are loaded immediately (because Rocket Loader skips them) jQuery has not yet loaded (because Rocket Loader is intentionally delaying their loading to let your page render faster) and this causes an error such as jQuery is not defined.

The solution here is simply to remove the data-cfasync="false" from each of the above scripts, and your slider will load just fine with Rocket Loader.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.