Woocommerce products images disappear when filtering

Anonymous

#142544

Hello,
I have Search and Filter Pro installed in a Woocommerce site i’m working on. I have it working with the Ajax feature. It filters as it should, but the results remove all of the images.

Is this an issue you have heard of before? If you have any insights, I would appreciate it greatly.

Here is a page where you can check it out:

http://americanheavyparts.com/ahp2017/inventory/

Thank you,

Rob

Anonymous

#142545

This reply has been marked as private.

Trevor

#142549

I can see what is happening. As Ajax triggers, it hides everything. This CSS is in your theme:

.woocommerce ul.products li.product .product-entry-slider {
    display: none;
}
.woocommerce ul.products li.product .woo-entry-image {
    display: none;
}

After a page loads, your theme is then using javascript to add inline a display: block; to these, plus much more to set the javascript working to make the sliders.

If this is done as a function, it is possible to trigger this again with some javascript from our FAQ Page, but you need to ask your theme developer. My guess is it is a function called oceanwpInitCarousel(). If you show the theme author this code:

<script>(function ( $ ) {
  "use strict";
  $(document).on("sf:ajaxfinish", ".searchandfilter", function(){
    console.log("ajax complete");
// load your WooCommerce carousel javascript here
  });
}(jQuery));</script>

They may advise you how to add that function.

Anonymous

#142558

Thank you Trevor,

I’ll explore that angle.

Sincerely,

Rob

Anonymous

#142560

Hi Trevor,

I OceanWP there is an option to use Image Swap for the product display rather than the gallery slider. Your post got me thinking that if I changed it back to Image Swap, it might solve the problem at least from that angle. So I did and it is behaving properly now.

Thank you for your help.

Sincerely,

Rob

[Author]

Posts