• Registered: 2014-10-30
  • Posts: 2

Topic: WordPress plug-in not working on mobile

I created a gallery with the WordPress (Pro) plug-in here:

http://gsueaglenation.com/game-pics-ga- … ul-monroe/

Lots of customization with config options. Seems to display fine on my laptop, but it doesn't work on my iPhone (5s). It only displays the first image (slightly cropped). No small screen mode or splash page.

I tried to change a couple of things in the configuration (gallery width/height), but haven't had any luck.

Help?!

  • Registered: 2012-04-24
  • Posts: 5,924

Re: WordPress plug-in not working on mobile

It only displays the first image (slightly cropped). No small screen mode or splash page.

What you are describing actually sounds like the Splash Page (which is displayed by default on small screen devices).
For more information on Screen Modes and the Splash Page, please see here.

First of all, I would recommend using a fixed pixed height for your gallery. If you use a percentage height as you currently do (80%), you need to ensure that the parent container(s) of the gallery have heights specified via CSS, otherwise Juicebox may not be able to calculate its own height (it needs to know what its height should be 80% of). This can be difficult to control in a WordPress environment where the gallery's parent containers are generated by the theme. (This is why the default height for a gallery created by WP-Juicebox is 600px.) Please see this note regarding Using Percentage Heights.

Try setting showSplashPage="NEVER" in your gallery's Pro Options text area to embed the gallery directly into the page in Small Screen Mode instead of the Splash Page.
Alternatively, try setting screenMode="LARGE" to force the gallery to be displayed in Large Screen Mode in all browsers and on all devices. (By default, Large Screen Mode does not use the Splash Page. The Splash Page will be used in Large Screen Mode only if showSplashPage="ALWAYS".)

Also, after making any changes, please be sure to clear your browser's cache before reloading your gallery's web page to ensure that your browser is fetching and using the most recent versions of your gallery files from your web server.