Images Size Issues with Latest Microsoft Outlook in version 1.2.3 (but not in version 1.2.2)

Hi VillaTheme team!

Thanks so much for reading these notes and for your support! We love the WooCommerce Email Template Customizer plugin – it is the best one out there in our experience!

Recently, with the WooCommerce Email Template Customizer Premium 1.2.3 update, I immediately got feedback from the website owners that the Order Summary images were “jumbo” and causing the email to look much different than designed. I asked them to send me an example because everything looked good to me in Gmail and my macOS Mail Client, so they sent me this screen recording to show me: https://vimeo.com/915337857/12ae159891

In that recording you can see that instead of adhering to the template design in the Customizer, the images are going “full width” or “jumbo” as they put it. The template seems to be showing our “full-size” (700×700) images and thus breaks the layout.

Come to find out, this appears to be an issue because they are using the Microsoft Outlook (MSO) Desktop client. Fortunately, they are using the most recent version of Outlook available, and they were at the time of our update to version 1.2.3 when we experienced this issue (February 2024): Microsoft® Outlook® for Microsoft 365 MSO Version 2402 Build 17328.20142 64-bit. You can see the versions here: https://learn.microsoft.com/en-us/officeupdates/current-channel.

What is odd is that this is not an issue with WooCommerce Email Template Customizer Premium version 1.2.2. Everything works great in 1.2.2. As a test, I reverted back to version 1.2.2 from version 1.2.3 and all was well again. The images look as expected.

I opened up the code in 1.2.2 and 1.2.3 to look for the absence of any CSS or other noticeably absent code in the latest update that might affect the most recent version of Outlook and I found that while the WooCommerce Email Template Customizer changelog only noted 3 updates to the Premium Version (Updated: Compatible with WC 8.4, Fixed: Fixed Dokan verification link, Updated: Update new twitter icon), there were multiple files in the includes folder with differences:

• email-samples.php
• email-builder.php (new $params on line 245: apply_filters( ‘viwec_accept_email_template_rules’)
• email-render.php (lots of changes done here starting on line 245!)
• email-trigger.php
• init.php
• utils.php

…and in the templates subdirectory:

• email-testing.php
• email-header.php (lines 192-202 missing)
• email-rules.php

From my quick observation, I can see that lines 192-202 in email-header.php were moved into lines 248-258 of email-render.php in version 1.2.3. Is there a chance that changes made in one of the files above (especially the email-render.php or email-header.php files) would affect the way the latest MSO 365 Outlook renders images in version 1.2.3?

You guys probably have already referenced this article, but here is a helpful guide on “Outlook Email Rendering Issues and How to Solve Them” from litmus.com: https://www.litmus.com/blog/a-guide-to-rendering-differences-in-microsoft-outlook-clients. A key takeaway from that article is in the “Got weird image sizes?” section towards the top which states: “Outlook does not support CSS styles for widths and heights. If you don’t include the width and height attributes, Outlook will display your image at its actual size. If you’re using retina images (which you should be), this will lead to giant images that’ll break your emails.” This actually feels/sounds exactly like what might be happening in our experience in Outlook.

My sense is that the issue is with changes made in the email-render.php file and/or the email-header.php file, but I of course am not 100% sure! Those two files just have the most changes from 1.2.2 to 1.2.3 which are easily visible in a free comparison tool like diffchecker.com/text-compare or free macOS tool like DirEqual, etc.

Also, I noticed that a LOT of new/recent issues on the VillaTheme forum of the WooCommerce Email Template Customizer not working with Outlook since version 1.2.3 (https://villatheme.com/search/OUTLOOK/). I’d like to point out that you all kindly acknowledged the issue in the post “Outlook Issues” from February 26, 2024 (https://villatheme.com/supports/topic/outlook-issues/). However, in that post you concluded that the issue primarily had to do with using old versions of Outlook which are no longer supported, but in our case, we are using the most recent version available (as indicated above and repeated here): Microsoft® Outlook® for Microsoft 365 MSO (Version 2402 Build 17328.20142) 64-bit. This is the desktop Outlook for Windows and is the most recent version available as you can see here: https://learn.microsoft.com/en-us/officeupdates/update-history-microsoft365-apps-by-date.

Everything of course looks GREAT in Gmail and on iOS, macOS, etc. etc. but would you all as a team be willing to check the files above and really consider/prioritize that this is actually still an issue with the latest version of Windows Outlook and that it does NOT occur in 1.2.2 but DOES occur in 1.2.3 so there is obviously something that changed (in my case I am thinking something that was removed/edited) and is possibly in the email-render.php or email-header.php files?

I would love to solve this for all VillaTheme customers/users but especially for us and our every day use as we love the plugin(!) but are finding that this particular issue causes it/us to appear very unprofessional and is unsuitable for use for Outlook users on 1.2.3. Reverting back to 1.2.2 solves it but that would mean we could never update with it moving forward unless we are able to figure this issue out.

The next question would be: “Are you able to access a copy of the MSO version we are using—Version 2402 Build 17328.20142—so that you can test it yourselves?”

I am hoping that someone on the team may have it or that it is worth purchasing to support compatibility of your awesome email template software, but if not, I personally would even be willing to help get it for you all because this is actually an issue for me across all of my Email Template Customizer licenses and I’d love to have it working for all of the clients I support as well.

I hope this helps! Please let me know if you need an additional screen recording or video explainer and thank you for reading this long note!