Woocommerce Image hover on shop/category pages

one other related question although it happened before your changes too

if you over over the moose antlers here

/art-category/sculpture/

you will see the ALTERNATE image pops up on tome of the main image?

any ideas on this?

thanks!

You can disable Display secondary image on hover in Customizer > Layout > Woocommerce.

oh great thanks! that seems like a silly feature imo, appreciate he help.

You're welcome :)

Hi David just a follow up on this as it seems now the custom field i have set to show the dimensions below the products shows up to the right of the image.

also on CHROME it doesnt show up at all?

see this page /art-category/painting/

and look at lush lady or drawing 2

thanks!

John

Which hook did you add the Custom Field too?
May be better to use the woocommerce_shop_loop_item_title hook - this will move it outside of the Image wrapper and make sure it displays below the image.

Hi David
it is added in the WCFM product custom addons, not sure how the WC hook would work with WCFM?

thanks
John

Hmmm - i wonder why that add it inside the Image container - odd.
You can try this CSS to fix it:

.inside-wc-product-image {
    padding-bottom: 2em;
}
.inside-wc-product-image .excerpt {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%); 
}

thanks! you are a superstar!

Glad to be of help

Hi David thanks so much for your help. Ive still got a few issues with product images showing correctly.

issue1: on the Category gallery landing page (Painting for example) it shows the images nicely squared with the hover effect working. But when a filter is chosen then the effect is lost (screenshot), and also unchecking the chosen filter and going back to the original gallery of images also shows the effect not working anymore (have screenshot if needed not sure how to share)

issue 2: When clicking on a product and going to the individual product page the Related Products at the bottom do not show the squared images and hover effect working.

let me know if you have any thoughts.

Thanks

John

You can share a screenshot by providing us with the URL to the image - this could be an image in your WP media library or a link to a cloud share eg. google drive.

ok thanks.

see here https://www.screencast.com/t/vAoqeBGTNnx

and here: https://www.screencast.com/t/q7rl2gQwCi74

thanks a lot!

John

The filter plugin strips out some of the Woocommerece markup for some odd reason which is why the square images break .... so it looks like we need a different solution.

Can you remove the CSS for the square images and ill take another look.

ok thanks! ive done that now

John