Problems after update of X and Cornerstone

You’re welcome. You forgot to copy/add this:

add_filter( 'after_setup_theme', 'remove_new_wc_features', 99 );

Here’s the full code again.

add_filter( 'after_setup_theme', 'remove_new_wc_features', 99 );

function remove_new_wc_features() {
	remove_theme_support( 'wc-product-gallery-zoom' );
	remove_theme_support( 'wc-product-gallery-lightbox' );
	remove_theme_support( 'wc-product-gallery-slider' );
}

Sorry was just copying your previously supplied screenshot. Now seeing this and still not applying;

https://www.evernote.com/l/AHaIxhxKZVlJFrEifRM4JcE6KWlFdGJ0jfAB/image.png

Just noticed that you have logged into the live site. I am working on the staging copy, details supplied on the first message.

Sorry about that. I was trying to show you where to add the code. That’s not the actual site I’m working on.

Your edit won’t push through because there’s a problem with your WordPress setup. Please check your wp-config.php if you’ve setup the security salts. Please contact your host if you need help with that.

As previously said, the code works on my end.

To add the border, you need to add this code in Appearance > Theme Options > Global CSS

.woocommerce div.product .images figure [data-thumb] {
    padding: 5px;
    border: 1px solid #ddd;
}

Please have a developer or your host fix your WordPress setup so the code I gave will work on your end.

Thank you for understanding.

Do you think the issue with the setup is because I am using a staging copy of the site? The staging copy is automatically made via the siteground tools. I have noticed that when trying to enter cornerstone on the staging copy that also doesn’t work and says there is a problem with the site setup.

If so I will try making all the changes directly to the live site.

Yes, the staging could be an issue. Please contact SiteGround and ask them why you can’t edit functions.php. They might be doing that for security reasons. If that is the case, you need to copy functions.php to your computer, edit it locally then upload it to your server.

There’s a known issue with SiteGround staging regarding Cornerstone. They will fix it but there’s no ETA.

Thanks.

Ok I have now made the changes needed to the staging copy functions.php. I am using the new woocommerce zoom function and will remove the old plugin that did the same. I have removed the new woo gallery slider, to make the thumbnails still be at the bottom. I have changed the size of the images and am regenerating the thumbnails.

One problem I have now is that when you click on one of the gallery thumbnails it doesn’t update it in the main image box but now opens it full screen. Can I make it work as it used to, clicking a thumbnail makes it display in the main image window?

Try removing this line from the code. It is the new WooCommerce lightbox. The old one is deprecated so if you remove the new lightbox function. You will have no lightbox.

remove_theme_support( 'wc-product-gallery-lightbox' );

Thanks.

I have tried that and it still opens the image full screen, but now in a lightbox.

What I would like, if possible, is to retain the functionality of the previous gallery. Click this link and you will see what was happening;

You will see that the images all display as square. When you click one of the thumbnails the image displays in the main image window and does not open up full screen. Is it possible for me to retain this functionality? I also notice that all images are displayed as thumbnails below the main image, but now the first image is not displayed as a thumbnail.

That is not possible because WooCommerce changed their lightbox. What you need would require drastic changes so that would be outside the scope of our support.

Regarding the thumbnails, WooCommerce also changed that. What’s new in X is that it added some style to the gallery (upper left small gallery images). That can be overriden by the code I have give previously.

Thank you for understanding.

As all I am using woocommerce for is to display products in a catalogue, without prices. Is it possible for me to keep using the old version of woocommerce but update X and cornerstone and keep the current functionality?

No, because X and Cornerstone was updated to be compatible with the new WooCommerce. You may stay with the old version but we could not guarantee compatibility.

Ok thanks for explaining things to me.

I am really not sure what to do. I really like the functionality that I previously had but want the site to be using the latest versions.

Do you think we could make the display of images look good using the new versions? What I am not liking is the way the thumbnails are really small and in the main display image.

Please add this to Appearance > Theme Options > Global CSS.

.woocommerce-product-gallery .flex-control-nav {
	position: relative;
	text-align: left;
	padding: 1em 0
}

.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img {
    height: 2em;
}

Adjust height: 2em; as per your needs.

Further customization from here would be getting into custom development.

Thanks.

I think I am going to have to just stick using the old versions, as I really dislike the way that the images display in the new. When you change the size of the screen the images really don’t work using the new system, you end up with part of the image being cropped or displaying part of the next image in the slider.

Sad that woo has chosen to make the image display get a lot worse. Thank you for your help understanding what the issue is.

You’re welcome, Mark.

I have just had another thought on this issue. Is there any way of making the main image box in the new woocommerce be responsive? As in the image size reduces according to the screen size, always showing the whole image and not part of additional ones (next image in the slider).

I see the issue when resizing the screen. I post this to our issue tracker to see if this is a bug since this does not happen when the page first loads. What I mean is, if you view the site in a mobile device, this does not happen because you’re not resizing the screen on the fly. This currently has no solution so you will need to disable the slider for now if this is important for your project.

Thanks

1 Like

I have managed to convince my client that to move over to the new way that the images will be displayed, so at least I will finally now be able to get things updated. :slight_smile:

Glad you’ve sorted out a resolution. :slight_smile: