• Registered: 2013-10-20
  • Posts: 3

Topic: gallery display problem

Hi - I installed the Juicebox Lite plugin on a Wordpress site and added a Flickr gallery to one of the portfolios:

http://ideafarm.com.au/portfolios/dayli … on-flickr/

It generally works fine, but when I navigate to it from the homepage it sometimes only displays one thumbnail and no full-size image (see screenshot):

http://ideafarm.com.au/wp-content/uploa … .54-PM.png

I can't work out what causes this as it seems to happen randomly. Any ideas?

Sorry for the lack of detail - not a developer - which is why plugins like this are so great :).

Anna

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

Re: gallery display problem

It looks like your current WordPress theme may be using some global CSS rules which are breaking the layout of the gallery.
Also, when validating your homepage with the W3C Markup Validation service, 142 errors and 34 warnings are reported so it looks like your theme is not generating valid HTML code which may also be contributing to the problem.
Try upgrading your Nemesis theme to the current version (v1.5.2) to see if this helps.
Otherwise, try using a different theme to confirm whether or not the Nemesis theme is responsible for the HTML errors on your page.
Even if the HTML are fixed, the problem may still be due to global CSS. There is no way to sandbox elements on a web page and global CSS rules may break plugins (such as WP-Juicebox) which have no option but to inherit these rules.

  • Registered: 2013-10-20
  • Posts: 3

Re: gallery display problem

Thanks for the quick reply. I had a look and most of the validation errors are related to a responsive video plugin I'm using rather than the theme (the rest where just my mistakes). I'm able to go in and edit the global CSS so if you have any idea which rules could be the culprit let me know. Thanks,
A

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

Re: gallery display problem

Thank you for fixing the HTML errors on your page. At least we can eliminate them from the problem now.

On further investigation, the problem may not be due to global CSS.
If you load the gallery from the a menu page and the layout appears broken, try resizing the browser window and you should see the gallery redrawn and look OK.
The problem seems to be with how your theme seems to load everything on the page at once and then selectively display whatever is chosen by the user. When the Juicebox code is first run on the page, the container into which the gallery is embedded is not visible on the page at all (and Juicebox may not be able to determine what its dimensions should be until its parent container is displayed).
Try changing the gallery's width from 100% to a fixed pixel value (such as 800px) to see if this makes a difference.

Also, when the gallery's link is clicked, you could try forcing the gallery to be redrawn by using the setGallerySize() and showGallery() Juicebox-Pro API methods. (Please note that this requires Juicebox-Pro.)
However, this may be difficult to implement within a WordPress environment where the pages are created dynamically.
It would require more than just a modification of the WP-Juicebox files as the call to the API methods would have to be placed in the links to the galleries.
I hope this points you in the right direction.

  • Registered: 2013-10-20
  • Posts: 3

Re: gallery display problem

Thanks Steven - changing the width worked but I want to keep the responsiveness. I think you're right about the selective loading problem.. I got rid of Ajax for that post which seemed to fix it. Thanks for all your advice :)
Anna