Problems after update of X and Cornerstone

Support
#1

Hi,

One of the websites that I built with X in 2012 has run into some problems when trying to apply the latest X and cornerstone updates.

I have setup a staging copy of the website and applied the updates to that site, so that you can see the problems. I will add details in a secure message so that you can see the issue.

Regards,

Mark

#2

The problem that is happening is that the css styling on the product thumbnails is changing. I use a plugin called cloud zoom to view the products. I will show you the difference in a secure note.

#3

Hey Mark,

The issue is because of the new WooCommerce features which X now supports. The new feature includes an image zoom so you don’t need a zoom plugin. Also, X now allows users to set their own product image size. What you need to do first is set your product image size in WooCommerce > Settings > Products > Display. After that, regenerate your thumbnails. Please follow the steps here.

If you don’t want the new WooCommerce features, you need to add this code in your functions.php. If you just want to remove the gallery (the old one is located at the bottom and the new one is located at the upper right corner of the image), you can just delete the zoom and the lightbox lines.

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' );
}

Hope that helps.

#4

Hi,

Thanks for the reply. Is there any way of me updating and keeping the display of images as they were previously? If possible I would like to keep the thumbnails below at the size they are with the shadow border around the images.

Regards,

Mark

#5

Hey Mark,

You will need to set the single product size and regenerate your thumbnails. That is necessary for this new version of X and WooCommerce.

Thanks.

#6

But what I am asking if there is any way for me to keep the thumbnails below the image in the size that they are with the styling?

What I am seeing currently in the staging copy is the thumbnails on the side of the main image and no border styling.

#7

That is the new feature of X and WooCommerce. Please add the code I’ve given previously to disable it and revert back to the old setup.

Thanks.

#8

Ok thanks. Using the editor to add the changes to the child themes function.php on the staging site I see the following in the editor;

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

All those warnings worry me so I haven’t applied them. Are you sure that is right?

#9

Are you sure it’s functions.php? It looks like style.css

I always test the code I give and double check it in PHP checker. It works and have no errors. But, depending on the functions already in your functions.php, it might not work on your end. If that happens, you need a third party developer to troubleshoot what’s causing the issue as this is normally outside the scope of our support to provide custom code.

Thank you for understanding.

#10

Sorry for making such a basic mistake.

I have now selected the functions.php and this is what I am seeing;

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

The changes don’t seem to apply.

#11

It does not work because there’s no opening <?php in your child theme. It looks like you removed what comes out of the box. Please download the child theme here and use it instead of your child theme. Add the code below the Additional Functions line like the screenshot below.

Thanks.

#12

I have updated the child theme to the latest version and attempted to make the changes. Again when I try they don’t apply;

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

Thank you for your help Christian.

#13

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' );
}
#14

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

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

#15

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

#16

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.

#17

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.

#18

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.

#19

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?

#20

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.