Images not visible in woocommmerce mail

Hi,

Thank you for your message.

To sum up – you receive an email with an HTML code in which the image is loaded from your website. The image is not displayed, and when you turn off the plugin it works (you check it all the time on this one e-mail).

Do I understand this correctly?

Can you enable the plugin and remove the code from the .htaccess file in the /wp-content/uploads/ directory?

Hi,

This is working now. Will the webp still be served now?

Geert

No, now WebP will not work on your website. Could you send me the HTML of this email (example)? What email program are you displaying on it?

Hi,

Below the part of the html where the image is loaded.
I use Spark to view the mail.

…….

<table border=”0″ cellpadding=”0″ cellspacing=”0″ width=”600″ id=”x_template_body”><tbody><tr><td valign=”top” id=”x_body_content” style=”background-color:#ffffff”><table border=”0″ cellpadding=”20″ cellspacing=”0″ width=”100%”><tbody><tr><td valign=”top” style=”padding:48px 48px 32px”><div id=”x_body_content_inner” style=”color:#424242; font-family:"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size:14px; line-height:150%; text-align:left”><p style=”margin:0 0 16px”>Hallo Geert,</p><p style=”margin:0 0 16px”>Ter info — we hebben je bestelling #3755 ontvangen en die wordt nu verwerkt.</p><h2 style=”color:#6da7b0; display:block; font-family:"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size:18px; font-weight:bold; line-height:130%; margin:0 0 18px; text-align:left”>[Bestelling #3755] (2 juni 2020)</h2><div style=”margin-bottom:40px”><table class=”x_td” cellspacing=”0″ cellpadding=”6″ border=”1″ style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; width:100%; font-family:’Helvetica Neue’,Helvetica,Roboto,Arial,sans-serif”><thead><tr><th class=”x_td” scope=”col” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>Product</th><th class=”x_td” scope=”col” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>Aantal</th><th class=”x_td” scope=”col” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>Prijs</th></tr></thead><tbody><tr class=”x_order_item”><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; padding:12px; text-align:left; vertical-align:middle; font-family:’Helvetica Neue’,Helvetica,Roboto,Arial,sans-serif; word-wrap:break-word”>Kinderkussens dieren zonder naam<div style=”border:1px solid #ccc; float:left; margin-right:5px; margin-bottom:5px; max-width:30%”></div><ul class=”x_wc-item-meta” style=”font-size:small; margin:1em 0 0; padding:0; list-style:none”><li style=”margin:0.5em 0 0; padding:0″><strong class=”x_wc-item-meta-label” style=”float:left; margin-right:.25em; clear:both”>Kussen:: <p style=”margin:0″>ZONDER VULLING</p><li style=”margin:0.5em 0 0; padding:0″><strong class=”x_wc-item-meta-label” style=”float:left; margin-right:.25em; clear:both”>Kleur:: <p style=”margin:0″>Zwart</p><li style=”margin:0.5em 0 0; padding:0″><strong class=”x_wc-item-meta-label” style=”float:left; margin-right:.25em; clear:both”>Afbeelding:: <p style=”margin:0″>Bizon</p></td><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; padding:12px; text-align:left; vertical-align:middle; font-family:’Helvetica Neue’,Helvetica,Roboto,Arial,sans-serif”>1 </td><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; padding:12px; text-align:left; vertical-align:middle; font-family:’Helvetica Neue’,Helvetica,Roboto,Arial,sans-serif”><span class=”x_woocommerce-Price-amount x_amount”><span class=”x_woocommerce-Price-currencySymbol”>€</span>16.95</span> </td></tr></tbody><tfoot><tr><th class=”x_td” scope=”row” colspan=”2″ style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left; border-top-width:4px”>Subtotaal:</th><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left; border-top-width:4px”><span class=”x_woocommerce-Price-amount x_amount”><span class=”x_woocommerce-Price-currencySymbol”>€</span>16.95</span></td></tr><tr><th class=”x_td” scope=”row” colspan=”2″ style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>Verzending:</th><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”><span class=”x_woocommerce-Price-amount x_amount”><span class=”x_woocommerce-Price-currencySymbol”>€</span>2.95</span> <small class=”x_shipped_via”>via Brievenbuspost NL</small> </td></tr><tr><th class=”x_td” scope=”row” colspan=”2″ style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>Betaalmethode:</th><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>iDEAL</td></tr><tr><th class=”x_td” scope=”row” colspan=”2″ style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”>Totaal:</th><td class=”x_td” style=”color:#424242; border:1px solid #e5e5e5; vertical-align:middle; padding:12px; text-align:left”><span class=”x_woocommerce-Price-amount x_amount”><span class=”x_woocommerce-Price-currencySymbol”>€</span>19.90</span> <small class=”x_includes_tax”>(inclusief <span class=”x_woocommerce-Price-amount x_amount”><span class=”x_woocommerce-Price-currencySymbol”>€</span>3.45</span> BTW 21)</small> </td></tr></tfoot></table></div><div class=”x_delivery-options”></div><table id=”x_addresses” cellspacing=”0″ cellpadding=”0″ border=”0″ style=”width:100%; vertical-align:top; margin-bottom:40px; padding:0″><tbody><tr><td valign=”top” width=”50%” style=”text-align:left; font-family:’Helvetica Neue’,Helvetica,Roboto,Arial,sans-serif; border:0; padding:0″><h2 style=”color:#6da7b0; display:block; font-family:"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size:18px; font-weight:bold; line-height:130%; margin:0 0 18px; text-align:left”>Factuuradres</h2><address class=”x_address” style=”padding:12px; color:#424242; border:1px solid #e5e5e5″>–<br>–<br>–<br>–</address></td><td valign=”top” width=”50%” style=”text-align:left; font-family:’Helvetica Neue’,Helvetica,Roboto,Arial,sans-serif; padding:0″><h2 style=”color:#6da7b0; display:block; font-family:"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size:18px; font-weight:bold; line-height:130%; margin:0 0 18px; text-align:left”>Verzendadres</h2><address class=”x_address” style=”padding:12px; color:#424242; border:1px solid #e5e5e5″>–<br>–<br>–</address></td></tr></tbody></table><p style=”margin:0 0 16px”>Bedankt dat je cadeaumomenten.nl gebruikt!</p></div></td></tr></tbody></table></td></tr></tbody></table>

I checked it for you using Spark app on the phone. I prepared one picture on my website in .jpg format and to see the difference, I edited the original file by adding an inscription.

When I send an email to Gmail, the image in WebP format loads. When I use Spark on Android it loads the original photo (I see this additional inscription) because Spark does not support WebP.

Can I still help you somehow?