Cache or Minification
In this article
- Slider only show up correctly for logged in users, not for logged out users
- Problem with minifications
- WP Rocket WordPress
- WP Fastest Cache WordPress
- JCH Optimize
- Nitropack WordPress
- Cloudflare’s Rocket Loader
- Autoptimize and Litespeed cache WordPress
- Autoptimize WordPress
- SG Optimizer WordPress
- WP Meteor
Slider only show up correctly for logged in users, not for logged out users
When you are seeing differences between logged in and logged out users, that always means a cache plugin problem. Cache plugins are working that way, that you are seeing the not cached version when you are logged in, but the cached version where you are logged out. You should try to clear the cache of your website's caching plugin and if that wouldn't work, search for the name of your cache plugin in our documentation in case you find one specifically for that plugin.
We're storing one version of the slider, so if you make changes to the slider, but it doesn't show up that also happens because of a 3rd party cache. Make sure you clear your cache plugin's cache after every change you make in the slider.
Problem with minifications
You could also try to find some "exclude" option at the plugin's settings, where you could exclude our files by file path:
WP Rocket WordPress
If you are using WP Rocket, you might experience issues with its minification which changes the loading order of our files.
To find the minification/optimization settings of WP Rocket, you have to go to your left WordPress admin menu's Settings → WP Rocket → File Optimization.
This option isn't compatible with our codes, so you have to turn it off.
Excluded our files
WP Rocket also has an exclude option, where you should write this to the Excluded CSS Files option:
These are the places from where we are calling in our files, so this should make the minification to skip them.
(.*)smart-slider(.*).js new _N2 this._N2
WP Rocket CDN
WP Rocket's CDN option has a bug in its current version (2021.05.18.), that it cannot handle urls without http or https within srcsets, like this one:
<picture> <source srcset="//example.com/image.svg"> <img src="//example.com/image.png"> </picture>
and they are adding cdn twice to the url, while it only should be added once: //cdn.cdn.example.com/image.svg
Until they will resolve it, you should turn it off at your WordPress left admin menu's Settings -> WP Rocket -> CDN -> Enable Content Delivery Network.
Removes unused CSS
Remove unused CSSoption messes up the sliders, so you should add the following to the
CSS safelistfield to exclude our codes:
.n2-ss-loaded .n2(.*) #n2(.*) ss3(.*)
Remove unused CSSoption of WP Rocket is currently in Beta, and it can have bigger issues so we currently don't support it.
WP Fastest Cache WordPress
If your Smart Slider doesn't work with the CSS and JS minification of WP Fastest Cache, then you could exclude our files from WP Fastest Cache by adding these words to the CSS and JS url containment exclusion:
Go to your Extensions → Plugins, filter out the "system" plugins and move the Smart Slider 3 System Plugin plugin before JCH Optimize. This is the order of how codes are running on your website, and this could make JCH Optimize to skip our codes.
|Asset URL/Code||Resource Type||Resource Relation||Device||Excluded Operations|
As you can see on the screenshot below
Cloudflare’s Rocket Loader
data-cfasync="false"to them. Go to Global settings → Framework and find
Autoptimize and Litespeed cache WordPress
Both Autoptimize and Litespeed cache seems to have an option for Critical CSS. This isn't compatible with our slider, so you should turn it off.
You can try to exclude our CSS and JS files from Autoptimize's minifications by adding our folder to the exclusion list:
Free Smart Slider 3:
Pro Smart Slider 3:
Aggregate CSS-files? option prevents the fonticons from loading properly. To solve the problem, you should write the following to the
Exclude CSS from Autoptimize: field:
fontawesome.min.css, icomoon.min.css, linearicons.min.css, materialicons.min.css, typicons.min.css
Then go to Global settings → Framework and enable
Async non-primary CSS to async the fonts from our end.
SG Optimizer WordPress
SG optimizer's Combine CSS Files option causes some of our files not to be called in, as it skips codes for some reason. Turn off
SG Optimizer →
Frontend Optimization →
Combine CSS Files and it should solve the problem.
The WP Meteor plugin mess with the loading of our codes, so you'll need to exclude everything Smart Slider related from their optimization.
To test if it's actually WP Meteor that causes the problem, add
?wpmeteordisable after the URL where you see the problem. The sliders should load normally afterwards.
WP Meteor → Exclusions tab, turn on "Exclude scripts matching regexp from optimization", and write the following URLs to the field:
https://yoursite.com/in the URL examples below with your site URL.
Smart Slider Free
https://yoursite.com/wp-content/plugins/smart-slider-3/Public/SmartSlider3/Application/Frontend/Assets/dist/n2.min.js https://yoursite.com/wp-content/plugins/smart-slider-3/Public/SmartSlider3/Application/Frontend/Assets/dist/smartslider-frontend.min.js https://yoursite.com/wp-content/plugins/smart-slider-3/Public/SmartSlider3/Slider/SliderType/Simple/Assets/dist/ss-simple.min.js https://yoursite.com/wp-content/plugins/smart-slider-3/Public/SmartSlider3/Slider/SliderType/Simple/Assets/dist/smartslider-backgroundanimation.min.js https://yoursite.com/wp-content/plugins/smart-slider-3/Public/SmartSlider3/Widget/Arrow/ArrowImage/Assets/dist/w-arrow-image.min.js https://yoursite.com/wp-content/plugins/smart-slider-3/Public/SmartSlider3/Widget/Bullet/Assets/dist/w-bullet.min.js
Smart Slider Pro
https://yoursite.com/wp-content/plugins/nextend-smart-slider3-pro/Public/SmartSlider3/Application/Frontend/Assets/dist/n2.min.js https://yoursite.com/wp-content/plugins/nextend-smart-slider3-pro/Public/SmartSlider3/Application/Frontend/Assets/dist/smartslider-frontend.min.js https://yoursite.com/wp-content/plugins/nextend-smart-slider3-pro/Public/SmartSlider3/Slider/SliderType/Simple/Assets/dist/ss-simple.min.js https://yoursite.com/wp-content/plugins/nextend-smart-slider3-pro/Public/SmartSlider3/Slider/SliderType/Simple/Assets/dist/smartslider-backgroundanimation.min.js https://yoursite.com/wp-content/plugins/nextend-smart-slider3-pro/Public/SmartSlider3/Widget/Arrow/ArrowImage/Assets/dist/w-arrow-image.min.js https://yoursite.com/wp-content/plugins/nextend-smart-slider3-pro/Public/SmartSlider3/Widget/Bullet/Assets/dist/w-bullet.min.js
If excluding the URLs does not make any difference, contact the developers of WP Meteor, because that means their exclusion doesn't work properly.