Can’t open Google photos images

None of these is a bug – all of it is caused by plugin conflicts or user error.

The first thing I will suggest is to disable lazy loading that you have activated via JetPack. Lazy loading doesn’t load an image until it scrolls into view, and Photonic’s layouts requires the images to be loaded before the layout renders. This causes conflicts and in all likelihood is causing your white spaces.

Second, you have set your “Main image” size to “original”. There is no such size in Google – you have to provide a numeric size. Specifying “original” is what is causing your “requested content cannot be loaded” error.

Third, you have many photos, and you have set your “Tile size” to 1600. Assuming that your pictures are high-resolution, each 1600px image is going to be at least 3 MB. With 100 images shown, you are automatically setting up your page to load 300 MB!! Change your tile size to something like 400px, and leave your “Main size” at something like “1600px”. That will make your page load a lot faster.

Fourth, your SiteGround Optimizer plugin is throwing a JavaScript error.

3/ On load more the new images don’t fill in the bottom of the page but brake the order of the whole gallery. The user wan’t go up and down …this is a serious bug.

Actually this is working exactly as designed and is not a bug at all. You are looking at a masonry layout, which is a “column first” layout. Basically all your content is one long column, which is then split out into 3 columns. You read a masonry layout from top to bottom, then move to the next column, and then the next column (think of it like a display at a busy airport, which is showing flight details). You don’t read it from left to right as you are trying to. If you are adding more photos, you are still keeping 3 columns. If you didn’t want your columns to get rearranged, your third column would get 100 additional photos and would be much longer than the others – that is just classic poor design. So a Masonry layout will always shift content upwards and left.

If you don’t want this sort of behaviour, switch to a “Justified Grid” layout, which is read from left to right. All photos will get added the end in your natural flow and there is no rearrangement of columns. Masonry layouts are useful when you have fewer images, not when your images stretch out to several pages.

Hi Sayontan,

thanks for the quick reply!

Everything makes sense, thanks.

Tile size in this case hasn’t been set at all. No idea why it takes 1600 as the original photo is 960px. I left now the main photo to no value and it works fine.

I tried the Justified layout which renders as “random” but it doesn’t look good as it randomly makes the photos squared or miss-dimensional. I expected it to work as masonry but in a horizontal manner. It modifies the proportions which is a not desirable effect.

Great support thank you!

Tile size in this case hasn’t been set at all. No idea why it takes 1600 as the original photo is 960px. I left now the main photo to no value and it works fine.

The default value for the main image, if none is specified, is 1600, and the same goes for the tile.

I tried the Justified layout which renders as “random” but it doesn’t look good as it randomly makes the photos squared or miss-dimensional. I expected it to work as masonry but in a horizontal manner. It modifies the proportions which is a not desirable effect.

Trust me – it doesn’t do any such thing for the Justified Grid layout. This basically goes to my first point, about disabling lazy loading. When you use a lazy loading plugin, that plugin replaces images with placeholders. Now, this works alright if the lazy loading plugin knows the sizes of the images beforehand, but in general cases it is not possible to know the sizes of the images without first downloading the images (which defeats the purpose of lazy loading). So, without knowing the sizes, the lazy loading plugin uses some arbitrary sizes, which completely violate the aspect ratio of the original photos and the layout gets butchered.

If you disable lazy-loading from within JetPack, your justified grids will work just fine.

Thanks a lot!

Just a question. How does it work … does it cache the photos (with all resized sizes) on the local server or takes them from Google/Smugmug …. every time?

Just a question. How does it work … does it cache the photos (with all resized sizes) on the local server or takes them from Google/Smugmug …. every time?

Photos are pulled live from Google / SmugMug each time. There is no caching happening offline. The goal is to make sure that changes to things such as image size, titles, tags, album structures etc. are available real-time on your WP site.

Risking to go off-topic but how about SEO? How to put tags, etc.? Best practices … Maybe an info link if you have? Thanks

another thing to add-on … I just saw Yoast sitemap shows 0 images. Any way to fix this?

Risking to go off-topic but how about SEO? How to put tags, etc.? Best practices … Maybe an info link if you have? Thanks

This is entirely unconnected to what I wrote above. What I meant when I mentioned “tags” were basically tags that you put in on Flickr, or keywords on Zenfolio or SmugMug. Photonic lets you pull images based on such information. E.g. you can pull photos that have a keyword “wedding”.

What you do with those on your site is up to you. You could put in a keyword called “wedding” on the page with your galleries using your site’s SEO plugin – Photonic has no connection with it.

What Photonic will do, though, is include the captions for the photos from your source directly on your page by making it a part of the content. So, if you “View source” for your page, the captions you have on SmugMug or elsewhere will show up in the markup. And so, if a crawler goes through your site, this is the content that gets indexed.

Basically Photonic is a content tool, not an SEO tool. It is optimized to get things indexed by crawlers, but it has no say over what you are putting on a page, or what do with your SEO plugins. E.g. if you use your SEO plugin to add a “wedding” tag to a page, but in your page you include photos with wildlife, that is not something in the plugin’s domain to handle. This is very similar to a case where, if you didn’t have Photonic, and simply wrote about wildlife on a page tagged “wedding”, there would be a mismatch between your content and your SEO.

another thing to add-on … I just saw Yoast sitemap shows 0 images. Any way to fix this?

I thought a sitemap pertains to images on your site. None of these photos is on your site, so why would you expect them on a sitemap?

Hi Sayontan,

is there any custom code to be used so the images appear in Yoast sitemap? They’re not on my website physically but they are the site images and must appear in sitemap somehow. Same as Jetpack images, they come from CDN but they do appear in sitemap.

Thanks

The original images for JetPack CDN are from your site. Even if you disable JetPack CDN your images will still show. That is why it is possible to include those images on your sitemap. With Photonic the images are never added to your site, so they will not be in a sitemap. Even if you use a hack to include them in the sitemap, the Sitemap protocol does not permit inclusion of URLs from different domains, and Google will report an error for your case.

How does it affect page/site SEO?

A sitemap is a very small component of your site from an SEO point of view. I have already written quite elaborately above how Photonic helps SEO via enhancing your content.