Mjml: The columns or media queries break in Gmail

[Hodakhosravi]

Hi.
I develop some callout UI blocks and modify media queries to be centered in mobile view and give some padding in desktop view. But as I test the blocks they have issues in Gmail. I tried to input the query for Gmail, but It didn't work. I never had issue in Gmail before
This is how the blocks should be :

.

and this is the Gmail view.

[iRyusa]

How did you send the email ? Can you try with https://putsmail.com/ please ?

[Hodakhosravi]

How did you send the email ? Can you try with https://putsmail.com/ please ?

I send the test by MailChimp But I try with https://putsmail.com/ and it looks perfect here. But as my client send the campaign in MailChimp I should debug it in there

[GarryFlemings]

@Hodakhosravi: When you prepare HTML (as you do with MJML), you want the HTML to leave the ESP exactly as you send it to them. Some ESPs do that; putsmail.com is one. Some ESPs don't; this evidence makes it seem like MailChimp changes the HTML before sending. (That's consistent with what we've heard before in this community about MailChimp, but that doesn't make it true!)

Maybe research MailChimp to know for sure?

Maybe ask your client to allow you to use only MailChimp tooling in the interest of reliability? And educate them about the resulting flexibility in email design?

This could be a nice consulting opportunity. If you talk to your client about a tradeoff between (1) email features available through other ESPs or (2) email features available through MailChimp, you'll be talking to them at a business level, not a developer level. Their choice between the two is a business decision.

Good luck!

[Hodakhosravi]

@Hodakhosravi: When you prepare HTML (as you do with MJML), you want the HTML to leave the ESP exactly as you send it to them. Some ESPs do that; putsmail.com is one. Some ESPs don't; this evidence makes it seem like MailChimp changes the HTML before sending. (That's consistent with what we've heard before in this community about MailChimp, but that doesn't make it true!)

Maybe research MailChimp to know for sure?

Maybe ask your client to allow you to use only MailChimp tooling in the interest of reliability? And educate them about the resulting flexibility in email design?

This could be a nice consulting opportunity. If you talk to your client about a tradeoff between (1) email features available through other ESPs or (2) email features available through MailChimp, you'll be talking to them at a business level, not a developer level. Their choice between the two is a business decision.

Good luck!

thanks for your quick answer and help

[iRyusa]

Can you check you're using MJML 4.10.x ? Because we did fix a comment in the HTML that remove the headstyle in Mailchimp. It was reported back in #1581

[Hodakhosravi]

Can you check you're using MJML 4.10.x ? Because we did fix a comment in the HTML that remove the headstyle in Mailchimp. It was reported back in #1581

thanks. I am already using MJML for more than 1 year but recently I had a lot of issues with Gmail.

[iRyusa]

What version of MJML you're using ?

[Hodakhosravi]

I cant

What version of MJML you're using ?

I use mjml -v but it gives me error : Command line error:
No input argument received
I use mjml with atom

[iRyusa]

The option is -V that’s why 😄

On 16 Jul 2021, at 19:30, Hoda Kh @.*> wrote:


I cant

What version of MJML you're using ?

I use mjml -v but it gives me error : Command line error:
No input argument received

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or unsubscribe.

[Hodakhosravi]

The option is -V that’s why 😄
…
On 16 Jul 2021, at 19:30, Hoda Kh @.*> wrote:  I cant What version of MJML you're using ? I use mjml -v but it gives me error : Command line error: No input argument received — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

mjml-core: 4.9.3
mjml-cli: 4.9.3
but I use the migrate from mjml 3 to try it live and copy and paste the HTML from there. I get better results. I think my atom doesn't use the last version of MJML . how can I fix it?

[iRyusa]

Yes atom plugin is not up to date. What you mean you get better results it works from the try it live HTML ?

[Hodakhosravi]

Yes atom plugin is not up to date. What you mean you get better results it works from the try it live HTML ?

I copy and paste my MJML from atom to live and from the upper part of the page, I used migrate from mjml 3 and then use the mjml and HTML that it gives to me. I get a much better result.

[Hodakhosravi]

Yes atom plugin is not up to date. What you mean you get better results it works from the try it live HTML ?
linter-mjml v1.2.0 support mjml 3.3.3 . There is no update for this plugin in Atom. Is there any way to migrate to the latest version?

[iRyusa]

Then if you don't have the issue on MJML 4.X i'm closing the issue.

MJML plugin on atom (https://github.com/mjmlio/atom-mjml-preview) is using MJML 4.8 so you should be fine. Check if you have an update available