Wrong path used for images

Hi @awelzel,

I’ve just updated the plugin from 4.0.8 to 5.0.6 and I’ve enabled PhotoSwipe v5 in the plugin settings.

Overall it works fine, but I get the following three errors in my Chrome browser console after I open and close an image in the lightbox:

Error 1:
first-sunday-in-the-new-building-14.jpg:1 GET https://www.mysite.com/wp-content/uploads/images/first-sunday-in-the-new-building-14.jpg 404

Error 2:
first-sunday-in-the-new-building:1 Uncaught (in promise) DOMException: The source image cannot be decoded.

Error 3:
photoswipe-auto-hide-ui.esm.min.js:3 Uncaught TypeError: Cannot read properties of null (reading ‘element’)
at PhotoSwipeAutoHideUI.showUI (photoswipe-auto-hide-ui.esm.min.js:3:29)
at PhotoSwipeAutoHideUI.mouseMove (photoswipe-auto-hide-ui.esm.min.js:5:57)
at document.addEventListener.once (photoswipe-auto-hide-ui.esm.min.js:7:149)

…Where “first-sunday-in-the-new-building-14.jpg” is the image I clicked on, and “first-sunday-in-the-new-building” is the slug of the post page I’m viewing in the browser.

There are two separate (related?) problems that I can identify here:

Problem 1:

The path shown in the URL, in the first console error above, is incorrect. The URL in the console error says this:

https://www.mysite.com/wp-content/uploads/images/first-sunday-in-the-new-building-14.jpg

But the image is actually located here on my server:

https://www.mysite.com/media/images/first-sunday-in-the-new-building-14.jpg

This is because I have renamed my “Uploads” directory to “Media” via the following entry in my wpconfig.php file:

define( 'UPLOADS', 'media' );

And I’m guessing that your plugin doesn’t recognise this correctly?

Problem 2:

The HTML generated for the image after I open it up in the lightbox, looks like this:

<img class="pswp__img" src="https://www.ibcstuttgart.de/media/images/first-sunday-in-the-new-building-14.jpg" alt="" style="width: 994px; height: 559px;">

Note that it’s using the correct path in the URL. However, it is missing a srcset variable (and I think it always has – this is not a new issue).

In comparison, the HTML of the <img> tag for the gallery image thumbnails does contain a correctly formatted srcset attribute.

The changelog of the plugin says “If possible PhotoSwipe will now be opened with lower resolution preview images for better performance.” But that doesn’t seem to be happening – instead, the HTML generated above shows just the main src attribute, but no srcset attribute needed to show lower resolution versions of the image.

Could this also be a cause of some of the errors in the browser console? Is there a reason that the srcset attribute is not used in the lightbox HTML?

Thanks for your support!

• This topic was modified 3 years, 7 months ago by GermanKiwi.