Image Lightbox not showing up on mobile screen

Just to add here, it seems like there is some conflict. I am using WP Super Cache, Autoptimize, WP-Disable plugins, as well as Cloudflare free version on my website. I deactivated all 4, and the Foobox Lightbox started showing up on the mobile screen. Then, I tried to narrow down the problem by enabling them one by one, and it seems to me that Cloudflare settings may have a conflict with FooBox plugin. I do need both Foobox and Cloudflare to work together, any ideas how I can resolve this conflict? Pls suggest.

Thanks,
Ambuj

hi Ambuj,

Can you provide a link to your site? I can then see why FooBox is not running

Hi Bradvin – After enabling and disabling plugins one by one and deleting cache, I now believe that the conflict is between Autoptimize and Foogallery/Foobox plugin. The Foobox Lightbox seems to be working fine with Cloudflare, WP Super Cache and WP-Disable, but as soon as Autoptimize is activated, the lightbox on mobile device screen stops working (though working on desktop perfectly).

In the Foobox settings, I have also tried “Disable Defer Javascript” both on and off, but the lightbox functionality still doesn’t work on mobile devices.

In the Autoptimize settings, I have also tried to exclude script “foogallery.min.js”, but it still doesn’t work. In Autoptimize, the settings which are checked currently are:

Optimize HTML Code,
Optimize Javascript Code,
Optimize CSS Code,
Generate data: URIs for images?
Also aggregate inline CSS?
Save aggregated script/CSS as static files?
Exclude scripts from Autoptimize: seal.js, js/jquery/jquery.js,wp-spamshield,jquery.js,jquery-migrate.min.js,ultimate-member/assets/js/,local-ga.js,foogallery.min.js

As you are subscribed to this plugin forum, you should get an email with the above link to my website to check it out, but I will delete it here after few minutes of posting.

Hoping for a quick resolution to this issue. Thanks a lot for your help and support.

Best,
Ambuj

The link you posted is not available @ambujgarg? I only see

Sorry, your request cannot be accepted.

frank (ao dev)

Sorry…A plugin ip geo block was blocking visitors from outside India. Now, I have deactivated that plugin, and you should be able to access the website. Thanks.

did some tests on my laptop (firefox on ubuntu linux, also tested in chrome) and never see the lightbox actually, just the images, even when autoptimize is disabled (by adding ?ao_noptimize=1 to the URL).

That is surprising because on google chrome and Microsoft Edge in laptop, I am able to see the lightboxes on the <mywebsite.com>/my-first-foogallery/ page even when all cache plugins including autoptimize are enabled, its only on mobile device screens that I am not seeing the lightbox and the navigation/close buttons (due to some conflict with cache plugin, which to me probably seems to be autoptimize, but I may be wrong as I am not an expert here.) Please let me know if I can provide any other details to debug the issue.

Thanks,
Ambuj

Please let me know if I can provide any other details to debug the issue.

I’ll leave that to foobox developer as (at least on my side) this looks like it’s not due to AO ??

Hi Bradvin – Can you please help me with resolving this issue. Autoptimize developer has already clarified that it is not due to conflict with his plugin. That only leaves WP-Super Cache and Cloudflare as potential conflicting cache plugins with Foobox. Did the website link I provided was of any help in debugging the lightbox not appearing issue?

Please let me know if you have any suggestions or ideas. Awaiting your response,

Thanks,
Ambuj

hi Ambuj,

Can you deactivate both WP Super cache and Cloudfare, then check if FooBox works.

Then enable one at a time to determine which plugin is causing the conflict.

Then we can look at the settings of that plugin to find a solution