Gallery Only Showing on Page Refresh

1. I added the Flickr gallery to my Photography page (menu item: Photography), but it only displays if I reload the page.

Your page is being loaded via JavaScript, and that is preventing some critical events from being triggered on Photonic. You will have to load the Photography page via the regular HTTP process instead of using AJAX (or JavaScript). This is probably a theme configuration item.

2. The image sizes of the tiles appear to be the same no matter what size I select. Where do I control the tile size?

When you are using the Gallery Wizard, in the last screen that says “Configure Your Layout”, there is an option for “Tile size” (if you are using a shortcode, this corresponds to the tile_size attribute of the shortcode). But this basically says what size of image should be used for the tile, not the final size of the tile itself. The sizes of what you see are computed with a CSS-based justified grid, so the tiles are going to be scaled to fit, regardless of the base image size that you are picking – the one thing that Photonic actively tries to avoid is scaling up an image, because it results in blurry photos. The CSS grid is fast, but has a few limitations. If you want more control, do the following:

1. From Photonic → Settings → Generic Options → Layouts → Random Justified Gallery – Minimum Tile height, set the value to something higher if you wish.
2. From Photonic → Settings → Flickr → Flickr Settings → Layout processing mode, set the option to use JS instead of CSS.

The JS mode generates prettier layouts but is more prone to marginal impacts with CLS (Cumulative Layout Shift). Its galleries scale better, and are always perfectly rectangular.

3. Is there a setting where I would cap the amount of tiles displayed, but then have more lazy-load when the user scrolls down?

You can’t do this, because any page can have an unlimited number of Photonic galleries. However, for each gallery you can control the number of photos shown, and then display a “Load more” button, which can be clicked to display more photos. Note that “lazy loading” the way you are describing will not work for flexible layouts such as the justified grid – a justified grid requires knowledge of image sizes, but a lazy loading plugin prevents knowledge of image sizes.

OMG, thanks so much! Yes, having AJAX enabled was the issue on the gallery only loading on refresh!

Thanks so much for the detailed information on all the points! Will try your solutions!

Sorry, just one more thing, where exactly do I control how many images are showing and display a load more button? Thanks!

Sorry for the delay in responding – I have been very busy on a personal front.

In the “Configure Your Layout” screen of the wizard, there is an option for Number of photos to show and “More” button text. If you are using the shortcode directly, you can set count='20' and more='Load More' as additional parameters.

Thanks so much! I tried this
[gallery type='flickr' view='photosets' user_id='58572433@N04' popup='hide' layout='random' count='20' more='Load More']
and the load button shows up, however only the gif loader is loading but no images…

Secondly, is there a way to replace the gif loader with an svg loader? Thanks!

• This reply was modified 3 years, 11 months ago by dada1978.
• This reply was modified 3 years, 11 months ago by dada1978.

You seem to be getting an error upon clicking the “Load More” button. I will need to investigate the root cause, but that can only happen later today or tomorrow (the Photonic stuff is on a different computer).

Thanks so much, and where can I donate to your efforts? Thanks!

I finally had a chance to access the computer with the code and tried replicating the problem, but it seems to behave fine at my end when I try to incorporate the “Load More” for the albums. I don’t know there is something conflicting with your theme, or there is some setting somewhere that is playing spoilsport.

Can you try using a different lightbox? You can change the lightbox from Photonic → Settings → Generic Options → Generic Settings → Inbuilt Lightbox Libraries.

Thanks, will try using a different lightbox as per your suggestion, although I like the one selected the best. Thanks