Slider looks broken on the site
In this article
Output buffer problem WordPress
Smart Slider 3 uses output buffering to load its own files, which was learned from the biggest plugins. The problem is there are some other plugins which use the output buffering wrongly.
Currently we know these plugins which have the problem:
- Speed Contact Bar (Problem is fixed in the 6.3 release, so please update it, if you are using this plugin)
- WP Meta SEO/ (Problem is fixed in 3.6.4, so please update it, if you are using this plugin)
- Ultimate Reviews by Etoile Web Design (They seem to be working on it and all of their plugins seem to have the problem.)
- Gravity Forms MC Unique ID Generator Field (Lite)
- SeoPressor (The conflict was reported on April 12, 2018)
- Insert PHP Code Snippet (Solution is added in version 1.2.5)
- Praison SEO (The problem was reported on May, 2018, but the plugin has received no updates since January, 2018)
- PageSpeed Ninja (The problem was reported on March 12, 2019)
- WooCommerce Currency Switcher (Problem is fixed in version 1.2.8)
- WordPress Ad Manager & AdSense Ads - Ad Inserter (Problem reported on April 17th, 2019. The problem exists in the pro version as well!)
- Squirrly SEO 2019 (Problem reported on December 19th., 2019)
- WPMarketingLabs (Problem reported on March 30, 2021)
How to debug the problem yourself?
this should write out an error log which helps you identify the plugin that causes your problem.
If the output buffering is messed up really badly, the Output Buffer Tester can't return anything. In this case, you should do a theme/plugin conflict check.
The test can have two results:
- Turning off all plugins does not solve the problem.
This means the problem happens because of the theme. Try switching back to a default WordPress theme, like TwentyTwenty, and everything should be fine like that.
- Turning off all plugins solves the problem.
The Output Buffer error happens because of one of your other plugins. Enable them back one by one to see which causes the problem.
- Turning off all plugins does not solve the problem.
Smart Slider 3 loads correctly on a page, then after navigating to some other page and coming back, the slider no longer works.
Your theme probably using AJAX to call in the pages, and when the AJAX loading happens some basic page loading events aren't trigged, so some codes won't run. Because of this, we don't support the slider to be called using AJAX.
Try turning on
Use Iframe In AJAX Calls the at the Global Settings → General and see if that helps. If it makes no difference, check whether your theme offers an option to disable or turn off this AJAX loading. Then you should turn it off, or change your theme into some other one which isn't using AJAX.
The images missing from the site, but they appear in the preview/editor WordPress
By default your images are coming from a similar url:
http://example.com/wp-content/uploads/slider1/image1.jpg. If you have an error, where you have a similar path for your website:
home/domains/xy.com/public_html/ and the url is wrong in a way, that it includes this path:
http://example.com/home/domains/xy.com/public_html/wp-content/uploads/slider1/image1.jpg then the problem could be, that the upload folder was customized wrongly.
You should go to your WordPress menu → Settings → Media → Store uploads in this folder and modify the value to the suggested default value. The way this setting works is, that if everything is correct with your upload folder's path, you cannot see this setting. So after saving the setting correctly if you see it being disappeared, don't worry, you just solved the problem.
Images look broken
If your images aren't appearing correctly, like there is only one color on the whole image, while in your server the original images look fine, then this is happening, because of the Optimize slide images feature. It is resizing your background images to the size of the slider, just this optimization option doesn't work with specially compressed images, so you should turn this option off, and it will be fine!
There are no arrows
These are the most common reasons why you can't see the arrows on your slider.
This problem usually happens, when some kind of 3rd party plugin messes with our codes. It's common that a theme, page builder or optimization plugin can't work properly with the data URLs what we use for the arrows by default.
Go to the Arrow control, find the
Base64option and turn it off. It should solve the problem caused by wrong codes unable to handle base64 images properly.
The other possible cause is when the them has
overflow: hidden;codes on the slider's container. This prevents your slider from being full width, and seeing the arrows at the edges. You can use your browser to check if this is the case. The problematic code should be removed from the theme.
The arrow and slide background colors are too similar
If you're using the default white arrows, and your slide background images are light as well, it's hard to spot the arrows. Go to the Arrow control and change the arrow colors to something more noticeable, or give them a dark background.
The same problem can happen if you're using the
fitSlide background image fill mode and there's no background color behind the slides. You should do the same and change the arrow color or give them a dark background.