How to Test Mobile Lightbox Issues Caused by Cache or Optimization Plugins
This article explains what to check when the property page lightbox looks different on mobile, the arrows have a different design, or the lightbox closes unexpectedly on mobile devices.
In most cases, this type of issue is caused by cache, JavaScript optimization, CSS optimization, image loading settings, or very large property galleries.
When to Use This Guide
Use this guide if you notice one of these issues on mobile:
- The property lightbox arrows look different from the desktop version.
- The lightbox design looks changed on mobile.
- The lightbox closes or reloads on mobile.
- The issue appears only on some devices or browsers.
- The issue appears after enabling a cache or optimization plugin.
The WPResidence lightbox should use the same theme design on desktop and mobile. If the mobile arrows look different, something on the website may be changing the default theme files, scripts, or styles.
Check the Lightbox on a Real Mobile Device
Test the issue on a real mobile device, not only with the browser responsive mode.
Open the property page on mobile and check:
- If the lightbox opens correctly.
- If the arrows match the expected theme design.
- If the lightbox closes, reloads, or crashes.
- If the issue happens on all property images or only after browsing several images.
If possible, compare the same property page on desktop and mobile.
Disable Cache and Optimization Settings
Cache and optimization plugins can change how theme JavaScript, CSS, images, and mobile behavior work.
This is common on hosting platforms that install optimization plugins by default, such as Hostinger with LiteSpeed Cache.
For testing, disable all optimization options from the cache plugin.
For LiteSpeed Cache, go to:
LiteSpeed Cache → Settings
Turn off all options from the active tabs, including:
- Cache options
- CSS optimization
- JavaScript optimization
- Image optimization
- Lazy loading
- Delay or defer JavaScript
- Combine CSS or JavaScript files
- Minify CSS or JavaScript files
Save the changes after each tab.
Clear All Cache and Test Again
After disabling the optimization options, clear all cache.
Check:
- LiteSpeed Cache plugin cache
- Hosting cache
- CDN cache, if used
- Browser cache
Then test again on the same real mobile device.
You can also test in a private or incognito browser window.
The goal is to confirm if the lightbox works correctly when no optimization option changes the theme files.
Check the Property Page Lightbox Settings
WPResidence lightbox options are managed from:
Theme Options → Property Page → Lightbox
Check the lightbox settings and confirm the setup used on the property page.
The Crop Images on Lightbox option can help the gallery display images with the same visual size.
The Slider for Lightbox option controls the slider engine used by the property lightbox.
If the lightbox issue happens only on mobile, test the available slider option and check which one works better for the website images and mobile devices.
Test with Fewer Gallery Images
If disabling cache and optimization options does not change the behavior, test the image gallery size.
Some mobile browsers can close, reload, or stop a page when too much image data is loaded.
Create a new test property and upload fewer images from the same image set.
For example:
- If the original property has many images, create a test property with 5 images.
- Use images with the same size and format as the original property.
- Open the lightbox on the same mobile device.
- Check if the arrows and lightbox behavior are correct.
If the test property works with fewer images, the issue may be related to the number or size of images loaded in the original property gallery.
Important Notes
The lightbox arrows should not have a different design on mobile unless custom CSS, a plugin, cache optimization, or external scripts change the default theme behavior.
If the browser console does not show a theme error, the next step is to test without optimization plugins active.
Always clear all cache after changing optimization settings.
For mobile issues, always test on the same real device before and after each change.
Related Help Articles
How to disable LiteSpeed Cache options to verify correctly the theme functionality