Not sending emails - adding various CSS to mails - sending email create 503 error

Your software
My Mautic version is: 5.1
My PHP version is: 8.1.29
My Database type and version is: 10.6.18-MariaDB

Your problem
My problem is:

I created a custom mautic email theme that worked perfectly in Mautic 4, allowing me to send and edit this emails without any issues. However, after upgrading to Mautic 5, I encountered a problem where the emails would stop sending without any apparent reason after editing or saving the theme three or more times.

Here are some details:

  1. Sending the (not edited) theme directly to a segment works fine initially, with emails sent in batches of 100 to 149 users.
    Imgur: The magic of the Internet
    Imgur: The magic of the Internet

  2. Opening, editing and saving the theme once works without issues. I can still use the “auto-generate” function for the text version of the email and send it without problems.
    Imgur: The magic of the Internet

  3. However, if I open and save the theme three or more times, the email stops sending. Additionally mautic creates a 503 error on sending.
    After update from 5.0 to mautic 5.1 the 503 is gone but still, the text version generation fails. If I attempt to send it anyway, the process halts at around 40 emails without any error message, indefinitely.

  4. When I return to the email tab, it doesn’t show that the emails were sent in the overview. Clicking on the email shows that some emails were indeed sent, but continuing the sending process only sends about 40 more emails each time without updating the overview. If I repeat this step multiple times, eventually all emails are sent, though they still don’t appear in the overview.
    The statistics are not usable and wrong.

Overview: Imgur: The magic of the Internet
Statistics: Imgur: The magic of the Internet

  1. Inspecting the email’s source code reveals that Mautic adds strange CSS code (presumably each time I save the template), which may be increasing the email size until it becomes too large to send.

my theme: https://mautic.vaegabond.com/email/preview/154
Theme Only code (without saving) after sent to user: --gjSlLf87Content-Type: text/plain; charset=utf-8Content-Transfer-Encoding: - Pastebin.com
Theme code (3 or more times saving) after sent to user: gist:aba304e4c560a60352f9c98273a009aa · GitHub

  1. Another issue I’ve noticed is that when I open the theme in the Mautic builder (not GrapesJS), I can’t edit the template right away; I have to save it once before editing becomes possible. I’m unsure why this behavior occurs.

None of these issues were present in Mautic 4, where the same theme functioned perfectly.

Settings in Mautic:
Queue for email set to doctrine
Imgur
before it was also set to sync without any difference

These errors are showing in the log: non

Hi @cremigerhonig,

If you developed your email from scratch using HTML, did you validate all the code to ensure it was error-free?

Also, check the error log of your Mautic installation to see if anything unusual catches your eye. This will help ensure there are no issues with your Mautic setup.

I strongly recommend using MJML to develop your emails. MJML is a markup language designed to simplify the process of coding responsive emails, and it’s easy to learn. This approach will integrate better with the GrapeJS builder in Mautic, making it easier to edit your custom themes or code.

I hope this helps in some way.

Best regards,
Ricardo

PS: There’s no need to comment on different posts and link to this one.

Thank you for your answer!

Regarding the email template issue:

  • The code is error-free and has been checked multiple times.
  • The Mautic installation is also error-free.
  • There are no errors in the log.

We have a few specific questions and preferences:

  1. Why does Mautic add unnecessary CSS?
  2. We do not want to use the GrapesJS builder; instead, we prefer to use the Mautic builder.
  3. The template we are using is HTML-based.

Thank you for your assistance.

When you open your email for editing in the GrapesJS builder, it automatically adds classes and the “unnecessary CSS” you mentioned. It’s crucial to always test the email using the GrapesJS builder. In MJML, this becomes easier to understand.

If your email doesn’t require specific HTML, you should consider using MJML for a simpler approach. It’s also easier to edit the code compared to using table elements. I recommend taking a look at MJML before deciding against it. However, Mautic supports both HTML and MJML.

When you open your email for editing in the GrapesJS builder, it automatically adds classes and the “unnecessary CSS” you mentioned.

I am using the Mautic builder, not GrapesJS, to open the email. The issue is that Mautic Builder continuously adds unnecessary CSS every time I save, causing the email to bloat.

I’ve attached the code earlier for your review. Please take a look:

Theme code (3 or more times saving) after sent to user: gist:aba304e4c560a60352f9c98273a009aa · GitHub

As you can see:
Theme after 1 save: 2,152 lines
Theme after 3 saves: 11,976 lines

That’s a sixfold increase in size, filled with unnecessary CSS that accumulates with each save.

As I see it, Mautic isn’t able to recognize that it has already added the “necessary CSS” once, and it keeps bloating the email with each save. This issue is not about using MJML since Mautic supports both MJML and HTML. The HTML template has been minimized and checked for correct code, but the problem persists.

Oh and this behaviour was not there with mautic 4 and previous using the exact same template… So blaming the template is not the way we will handle this :wink: (anyway, if you have suggestions on the template, they are welcome)

If you believe it is a bug report it on Mautic Github.

thank you

done