Resize image lightbox

Hey there! Can you send a link to what you are seeing?

Sure, I’m working on a local environment. But I threw up a new install with WooCommerce here and even on a different theme you can see that the lightbox takes up the whole page. It seems like WooCommerce lightboxes used to look more like this. I would like something like this so that the whole product page isn’t covered up when viewing the images.

Looks like the lightbox sizing and placement is set in this file contained in the WooCommerce plugin: /woocommerce/assets/css/photoswipe/photoswipe.css

I have tried adding a copy of this file to my child theme to override the plugin version, however so far it doesn’t seem to work. Changes to the themes style.css also don’t seem to have any affect on the lightbox.

Currently I can only restyle the lightbox by editing that file in the plugin, but I’m still working on it and will post if I find a solution as I am sure there are others who would like to edit the way this is displayed.

Ah yes, thanks for the links, I see what you mean.

This is correct in the latest version of WooCommerce.

You can change this with custom CSS but it would take a fair bit of work. For example .pswp is the size of the overlay and you can set it to 50% for height and width rather than 100% and it won’t take up the full screen. However it then takes more positioning and calculating how it would fit each size of your images, positioning of the images inside that and so on, so is a fair chunk of work.

The other option is to do what you are, but you’ll need to deregister the inclusion of the photoswipe.css as shown here:

https://github.com/woocommerce/woocommerce/blob/8048afe4ce0edaa9f4ab3c3e8fb3923f48b10b25/includes/class-wc-frontend-scripts.php#L309

Then re-register it in your child theme with the new location.

Please do let us know here if you have a working solution to share with others, thanks!

Hi there!

There hasn’t been a reply for a while so I’m going to close this ticket.

If you’re still having problems please open a new ticket, thanks!