BugWP logo BugWP
Back to Community
Home / Community / Plugin → Webp express

Troubleshooting Common WebP Express HTML Alteration Issues

24 threads Sep 16, 2025 Plugin → Webp express

Content

WebP Express is a powerful tool for serving next-generation WebP images on your WordPress site. However, one of its most complex features—the Alter HTML functionality—can sometimes lead to unexpected results. This guide covers the most common problems users encounter when this feature is enabled and provides practical solutions to resolve them.

Common Problems and Their Solutions

1. W3C Validation Errors

The Problem: The W3C validator may throw errors, such as "No width specified for image" in srcset attributes or "Element source is missing required attribute srcset." This often occurs when the plugin processes placeholder images or interacts with other plugins that modify image attributes.

The Solution: This is frequently caused by conflicts with lazy loading plugins. Ensure your lazy loading plugin is updated to the latest version, as many now use data-lazy-srcset attributes which are handled better. You can also try switching the "How to replace" option to "The complete page (using output buffering)" or "Use content filtering hooks" to see which one validates correctly.

2. Double <picture> Tags or Nested Elements

The Problem: The Alter HTML function incorrectly wraps an <img> tag that is already inside a <picture> tag, creating invalid, nested HTML structure.

The Solution: A known issue is that the plugin's HTML parsing can sometimes process images it shouldn't. A common workaround is to manually add the webpexpress-processed class to your <img> tags that are already within <picture> elements. This class tells WebP Express to skip processing that specific image.

3. HTML Alteration Not Working at All

The Problem: You've enabled Alter HTML, but no changes appear in your frontend source code.

The Solution: This is often due to a conflict with security or optimization plugins that also buffer output. A frequent culprit is Wordfence. Try temporarily disabling such plugins to test if WebP Express then works correctly. If it does, you can often re-enable them after adjusting their settings or finding a compatible configuration. Also, check that you are not hitting the 600kb output buffering limit mentioned in some threads.

4. Issues with Background Images (e.g., in GeneratePress)

The Problem: Background images set in themes or page builders like GeneratePress are not being converted to WebP.

The Solution: This typically happens because the CSS is either aggregated or inlined by another plugin like Autoptimize, placing it outside the normal processing hooks. The solution found by many users is to check the "Use inline style" option within the GeneratePress block settings. For other themes, you may need to adjust CSS aggregation settings in your optimization plugin to prevent inlining.

5. Incorrect CDN URLs in Srcset

The Problem: When using a CDN like Amazon S3, the srcset attributes generated by WebP Express point to your local server domain instead of the CDN URL, even when the CDN hostname is configured.

The Solution: This appears to be a limitation or bug in how the plugin handles CDN URLs for the generated WebP images stored in the wp-content/webp-express/ directory. You may need to use a different operation mode, such as "Varied Image Responses," which doesn't rely on altering HTML and instead serves WebP images from the original URL based on the browser's Accept header.

General Troubleshooting Tips

  • Test with Defaults: Before making complex configuration changes, test with the plugin's default settings to establish a baseline.
  • Check for Conflicts: Temporarily disable other plugins (especially caching, lazy load, security, and optimization plugins) to identify conflicts.
  • Review the Operation Mode: If Alter HTML causes too many issues, consider switching to "Varied Image Responses" mode, which can often achieve the same goal without modifying your site's HTML.

Most issues with the Alter HTML feature stem from conflicts with other plugins or themes that also manipulate the site's HTML and image tags. Isolating the conflict is the key to finding a stable solution for your specific setup.

Related Support Threads Support