Support » Plugin: Draw Attention » Does not work with Imagify + WebP

  • Resolved kisabelle

    (@kisabelle)


    When using Imagify’s “Display images in webp format” setting Draw Attention, breaks – the image is loading just fine but the loading animation does not go away and the map cannot be interacted with.

    Please let me know if you would like help testing a fix for this – being able to serve the images in webp has incredible benefits for the performance. Ideally the plugin should work with the webp <picture> element that Imagify replaces it with.

    Thanks!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Support Draw Attention Support

    (@wpdrawattention)

    Hi @kisabelle,

    Thanks for reaching out to us! We are currently looking into what it would take for us to support the webp format and can definitely let you know when we have an update to share.

    Thanks for your patience and feel free to reach out if there’s anything else we can help with in the meantime.

    Thread Starter kisabelle

    (@kisabelle)

    Hi @wpdrawattention, Imagify support have gotten back to me with a simple and quick solution which you could include in your plugin.

    Here is a link to it on Github: https://gist.github.com/markonikolic985/36d58e114474c54e56228e8bd02fbd96

    Here is my version – modified to include Draw Attention images

    
    add_filter('imagify_webp_picture_images_to_display', 'imagifySkipPictureReplacement');
    
    function imagifySkipPictureReplacement($images) {
       foreach ($images as $i => $image) {
          $classAttribute = $image['attributes']['class'] ?? '';
          if (strpos($classAttribute,'hotspots-image') !== false
                    || strpos($classAttribute,'imagify-skip-replacement') !== false)
             ) {
                unset($images[$i]);
             }
          }
       return $images;
    }
    Thread Starter kisabelle

    (@kisabelle)

    Forgot to mention, you can use this check to see if the code should be run:

    if ( is_plugin_active( 'imagify/imagify.php' ) {
    
    }

    Let me know if you end up adding this to an upcoming update!

    Plugin Contributor Natalie MacLees

    (@nataliemac)

    @kisabelle Thanks for sending this over. If you need a solution very quickly, you could drop this code into your theme’s functions.php file to make Draw Attention work when Imagify’s webp format option enabled without waiting for us to make any changes to Draw Attention. It just prevents Imagify from replacing Draw Attention images with the webp image format.

    We’re still planning to investigate fully supporting webp image format with Draw Attention, which would work with any plugin that is replacing images with the webp format. That way we wouldn’t need to include any plugin-specific code for handling different formats. We’ll keep you posted on what we find out.

    Plugin Contributor Natalie MacLees

    (@nataliemac)

    @kisabelle Just a note to let you know that in our next release, we’ll have support for using an image optimization plugin that supports webp. We tested with Imagify, ShortPixel, and Optimole and all worked fine. That should be out in a few weeks.

    Thread Starter kisabelle

    (@kisabelle)

    @nataliemac That is great to hear! Thanks for letting me know.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Does not work with Imagify + WebP’ is closed to new replies.