Return to previous page

After woocommerce update: Hover images have disappeared

This topic has 26 replies, 2 voices, and was last updated 7 years, 3 months ago ago by Rose Tyler

Royalty

Participant

February 13, 2018 at 13:14

Hello,
I just updated woocommerce (v. 3.3.1) and noticed that the hover effect images have disappeared. When I check it with developer tools, it shows this:
<img class="show image" src="" class="show-image" alt="">
So the src is empty, it shows no image.
How can I fix this?
Thank you.

#184952 Copied Theme version: 3.4 WooCommerce version: 3.3.1

25 Answers

Rose Tyler

Support staff

February 13, 2018 at 13:28

Hello,

3.4 theme version is not compatible with WC 3.3.1, so you may face some problem. You can downgrade WC version or wait for theme update, that will be released soon (within 1 week).

Regards

#184955 Copied

Royalty

Participant

February 13, 2018 at 13:30

Ok, hoping that the update will fix this. Downgrading is not that easy because the new woocommerce version made database changes. But I could use a backup..

#184957 Copied

Rose Tyler

Support staff

February 13, 2018 at 13:33

Ok. Feel free to ask if you have any other questions.

Regards

#184958 Copied

Royalty

Participant

February 16, 2018 at 20:07

Just updated my testpage to royal version 4.0, but the problem with missing hover images still exists 🙁

#185352 Copied

Royalty

Participant

February 17, 2018 at 20:41

Just wanted to admit that the hover (swap) images have not only disappeared from shop page, but also from the etheme (related products) slider…

#185377 Copied

Rose Tyler

Support staff

February 19, 2018 at 08:32

Hello,

Please provide us with your website URL so we can take a closer look.

Regards

#185429 Copied

Royalty

Participant

February 19, 2018 at 10:40

Dear Rose,
please find all information in private content. Thank you.

Please, contact administrator
for this information.

#185456 Copied
Rose Tyler

Support staff

February 19, 2018 at 12:22
Hello,

We’ve made some changes in royal/woocommerce/content-product.php and royal/woocommerce/content-product-slider.php files. The swap image will be got automatically from product gallery. Please add this css code in custom css:

.product-slide .product-image-wrapper.hover-effect-swap:hover img.show-image + img { opacity: 0 !important; }

and check.

Regards
#185473 Copied
Royalty

Participant

February 19, 2018 at 12:25

Thank you but now it shows the second product gallery image as hover image and not the one that I set as hover image..

#185475 Copied

Rose Tyler

Support staff

February 19, 2018 at 13:17

Hello,

Yes, you are right. We are planning to add this improvement in next theme update.

Regards

#185485 Copied

Royalty

Participant

February 19, 2018 at 13:19

Ok but it used to work until the last update of Royal and woocommerce. How can I fix this now?

#185486 Copied

Rose Tyler

Support staff

February 19, 2018 at 16:16

Hello,

We have fixed the problem on your site. If you do not set swap image, the second product gallery image will be shown, but if you select an image in product settings it will work also.
Is this ok for you?

Regards

#185525 Copied

Royalty

Participant

February 19, 2018 at 16:18

Thank you, that would be ok but now there are multiple error messages on the shop page :/

#185526 Copied

Royalty

Participant

February 19, 2018 at 16:21

Ah seems that you just fixed it, thank you.

#185527 Copied

Rose Tyler

Support staff

February 19, 2018 at 16:22

Hello,

Please check now.

Regards

#185530 Copied

Royalty

Participant

February 19, 2018 at 16:30

Thank you. Can you please fix it for content-product-slider.php too?
And will this be fixed in the next update? The perfect solution would be if it was like it was before: Show the swap image if there is one, and if there is none, just do nothing and keep the main product image.
Thank you.

#185534 Copied

Rose Tyler

Support staff

February 19, 2018 at 16:35

Hello,

You’re welcome!
To fix this for the slider please add the css code that we provided.
Ok.

Regards

#185536 Copied

Royalty

Participant

February 19, 2018 at 16:40

Ok, unfortunately its still not working perfectly. The swap images have other dimensions than the main images, although they are both 1000x1000px. The main product image is shown square, and the swap image as cropped to a rectangle… 🙁
Many thanks for your support.

#185538 Copied

Rose Tyler

Support staff

February 20, 2018 at 08:43

Hello,

We have checked this situation and this a bit strange, because on my test site all works fine. Please regenerate images using appropriate plugin, if this won’t help, try to change permissions on wp-content/uploads folder to 777 or ask about this your hosting provider support.

Regards

#185592 Copied

Royalty

Participant

February 20, 2018 at 08:57

Hm ok i am on the way to my office and will check it there. Also there seems to be a new image size with 250px (shop catalogue). I checked all settings (in settibgs > media) and in customizer but I dont find where to change it?

#185597 Copied

Rose Tyler

Support staff

February 20, 2018 at 09:14

Please read this article https://woocommerce.wordpress.com/2017/12/11/wc-3-3-image-size-improvements/

Regards

#185600 Copied

Royalty

Participant

February 20, 2018 at 09:56

Did you make any new changes? Because I saw that the files content-product and content.product-slider were edited this morning and now it works and all images have the right size….?

#185618 Copied

Rose Tyler

Support staff

February 20, 2018 at 10:02

Hello,

Yes, one of our developers did some changes. Please clear cache and let me know if this is ok now.

Regards

#185619 Copied

Royalty

Participant

February 20, 2018 at 10:14

Yes thank you its all working fine now. The only thing thats a bit disturbing is that the images “jump” on single product page – Ive added a video in private content.

Please, contact administrator
for this information.

#185623 Copied

Rose Tyler

Support staff

February 20, 2018 at 11:35

Hello,

This is default behavior for this gallery, but you can change this. Appropriate code can be found in royal/woocommerce/single-product/product-image.php file http://prntscr.com/ih9d51 (change to false). Please do such changes to child theme to prevent losing it after each theme update.

Regards

#185633 Copied
Viewing 26 results - 1 through 26 (of 26 total)