Back to Community

Troubleshooting WooCommerce Image Issues with Converter for Media

Content

Many users of the 'Converter for Media – Optimize images | Convert WebP & AVIF' plugin run WooCommerce stores. A common theme in support forums is encountering issues where product images don't display correctly, fail to convert to WebP, or cause problems in other areas like emails. This guide will help you diagnose and resolve the most frequent WooCommerce compatibility problems.

Why Do These WooCommerce Issues Happen?

The plugin works by intercepting image requests and serving modern formats like WebP to browsers that support them. However, WooCommerce is a complex ecosystem. Conflicts can arise from its dynamic image generation, the use of external services (like CDNs or service workers), or how specific themes and other plugins output image URLs. The plugin's conversion method (e.g., via .htaccess rules or Pass Thru mode) can also be a factor.

Common Problems and Their Solutions

1. WebP Images Not Loading on WooCommerce Pages

Symptoms: Images convert correctly on posts and pages, but product galleries, category pages, or single product pages continue to serve the original JPEG or PNG files.

Potential Causes & Fixes:

  • Check Your Loading Mode: As seen in Thread 1, switching the conversion method can resolve conflicts. In your plugin settings, try switching between the Pass Thru and .htaccess loading modes to see if one works better with your theme's configuration.
  • Theme and Plugin Conflict Test: As mentioned in Thread 5, a full conflict test is a critical step. Temporarily switch to a default WordPress theme like Twenty Twenty-One and disable all plugins except WooCommerce and Converter for Media. If the issue is resolved, reactivate your theme and plugins one by one to identify the culprit.
  • Caching: Clear all your caching layers—this includes any WordPress caching plugins, server-level cache, CDN cache, and your browser cache—after making any changes to your plugin settings.

2. Missing Product Images or Broken Thumbnails

Symptoms: Product images are completely missing from the storefront, replaced by a broken image icon, or appear as abnormally large, unstyled thumbnails.

Potential Causes & Fixes:

  • Service Workers or Advanced Caching: Thread 2 highlights that service workers can interfere with image delivery. If you use a service worker (common with PWA plugins), you may need to configure it to handle WebP images correctly or exclude your image directories from its cache.
  • Deactivate and Reactivate: If images are missing, deactivating and then reactivating the plugin can sometimes trigger a re-sync of the image delivery rules.

3. WebP Images in WooCommerce Emails

Symptoms: Order confirmation emails show broken images (red 'X') instead of product thumbnails.

Potential Cause & Fix:

  • Email Client Compatibility: As raised in Thread 11, the core issue is that most email clients (like Gmail or Outlook) do not support WebP images. The plugin should not serve WebP to these clients. If it happens, it indicates the user-agent detection might be failing for your mailer. The first step is to contact your hosting provider to ensure your server's .htaccess rules are correctly applied, as this is typically how the plugin avoids this problem.

4. External Services (Etsy, Facebook) Rejecting Images

Symptoms: Platforms like Etsy or Facebook, which pull product data via WooCommerce extensions, fail to import images because they receive a WebP format they cannot process.

Potential Cause & Fix:

  • How the Plugin Works: Thread 6 explains this well. The plugin does not change the actual image URLs in your database. It only serves different formats at the server level based on the browser making the request. Services like Etsy and Facebook use their own 'bots' or scripts to fetch images. If they receive a WebP, it means their bot identifies as a browser that supports it. A solution would require adding a condition to your .htaccess rules to exclude the user-agents used by these services, though identifying them precisely can be challenging.

Need More Help?

If these steps don't resolve your issue, the best course of action is to seek help from the wider community. When creating a new support thread, be sure to include your website URL, a detailed description of the problem, and the steps you've already taken to troubleshoot. This information is crucial for others to provide accurate assistance.