Support » Plugin: Image Optimization by Optimole - Lazy Load, CDN, Convert WebP & AVIF » Issues with images in Ajax search suggestions

  • Resolved lgwp3000

    (@lgwp3000)


    Hello,
    thank you for your plugin, it works great for us!
    We have one issue though. We are using AJAX Search for WooCommerce. The product images should be shown with the suggested products however these are not shown in the first search, the images are only shown when you search for the same thing for the second time. Not sure if this has something to do with the resizing or lazy load. I would appreciate any suggestion how to fix this.
    Thank you very much.
    Kristina

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Hello,

    I can see that you have a 500 WordPress error on your ajax request.
    I can see that the thumbs for the search load but I don’t think that the 500 is caused by Optimole.
    You should check the logs to see what the error is.

    We will help you solve this if it is related to Optimole.

    Thank you!

    Thread Starter lgwp3000

    (@lgwp3000)

    Thank you very much for your quick response, you helped us to identify and fix the error (it was indeed not Optimole related). Thanks again!

    Glad to help.

    Let us know if you have more questions or require more help.
    Have a great day!

    Thread Starter lgwp3000

    (@lgwp3000)

    Hello,
    I think the issue is still there for the images in the search suggestions. If the images are not cached previously only 1 px x 1 px image is displayed there. I was thinking that I will disable the images in the search suggestions as the details panel is working now however the details panel does not display on mobile so it is better to have the image in the suggestions as well for mobile users.
    Could you please take a look?
    Thank you!

    Hello,

    I can not see the issue: http://snpy.in/1dUCqx
    Have you cleared the cache from caching plugins? Maybe it is something local to you?
    Is there a specific way that I can use to replicate this?

    Let us know, thank you!

    Thread Starter lgwp3000

    (@lgwp3000)

    Hello,
    the issue appears when you search for product you have not searched for or looked at before so that the product picture is not in your browser cache (or at least that is my understanding of the issue).

    Try searching for e.g. kridla or labut so that you are shown products which were not part of your previous search suggestions.
    See screenshot, in this case 2 out of 3 pictures were loaded properly:
    https://imgur.com/a/5NfSdL9

    In this one none of the two pictures were loaded properly:
    https://imgur.com/a/BCRlV70

    This is the link to one of the images which is resized too much (size seems to be resized to 4x4px):

    <img data-opt-src="https://ml9lhni4ibgd.i.optimole.com/VyT4vwY.CfOg~31012/w:64/h:83/q:auto/https://mytutu.sk/wp-content/uploads/2020/04/Cygne-42.jpg" src="https://ml9lhni4ibgd.i.optimole.com/VyT4vwY.CfOg~31012/w:4/h:4/q:auto/https://mytutu.sk/wp-content/uploads/2020/04/Cygne-42.jpg" alt="Tutu šaty Luna Luna Cygne biele" class="" data-opt-lazy-loaded="true" data-opt-otimized-width="4" data-opt-optimized-height="4">

    The issue appears on all devices and browsers.

    Thank you for your help.
    Kristina

    Hello,

    From looking at the tag I think the issue is that it detects the image as being 4×4 px from css so it rescales to that size when lazy-loading. You can specify either on the image tag a width and height or make sure in css the image container keeps has a min-width and min-height of 64×83 witch I think is the size of the thumbnails.

    This should solve the issue, or you could exclude the images from that section from lazy-loading, but I would suggest changing the img attributes or the css.

    Let us know how it goes.

    Thank you!

    Thread Starter lgwp3000

    (@lgwp3000)

    Thank you, the css solution worked!

    Glad to hear it is now sorted.

    Have a great day and feel free to contact us if you have more questions or require more help.

    Thank you!

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Issues with images in Ajax search suggestions’ is closed to new replies.