Are mj-attributes functional on grapesjs mjml?

Product Support
1

Your software
My Mautic version is: 4.1.0
My PHP version is: 7.4
My Database type and version is: MySQL 8+

Your problem
My problem is: I use mj-attributes for global attribute on all of the mjml components but it doesn’t seem to be functional in Mautic instead I have to apply attribute to each components. I tested it on MJML’s “Try it Now” and it working as intended.

These errors are showing in the log: none

Steps I have tried to fix the problem: None

2

yep, sad but true - see https://forum.mautic.org/t/introducing-the-new-email-and-landing-page-builder/20640:

Are there any limitations or known issues?

Currently there are some MJML elements which are not rendered by the builder:

  1. mj-head components are not rendered:

mj-attributes, mj-breakpoint, mj-font, mj-html-attributes, mj-preview, mj-style, mj-title

  1. Body components not rendered include:

mj-table

3

Thanks for pointing it out …

:frowning:

Oh well, hopefully one day … it’ll get included …

4

What about full-width attribute? It doesn’t seem to be working with section or wrapper component.

5

I have to make an addition here. mj-style actually works.
When you edit a text box, the text inside will be turned into a paragraph.
Therefore this would work:

<mj-head>
	<mj-style>
     .greeting p, a {
	  color: #000 !important;
	  font-size: 12px !important;
	  font-weight: bold !important;
	  font-family: Verdana !important;
	  padding: 0px 0px 0px 0px !important;
	  }
	</mj-style>
  </mj-head>
<mj-body>
.
.
<mj-text padding="0px 0px 0px 0px" css-class="greeting">
<p>Hello movie lovers!</p>
</mj-text>
6

oh, true, we’re using that too and it does work! Others too, like mj-title, so the linked posting is not accurate (anymore)
BUT at least mj-attributes does not work, and I understand that’s an architectural limitation that cannot easily be solved on the Mautic side :frowning:
(Not sure what the actual state and perspective is, frankly…)

7

Would this work then?

<mj-head>
	<mj-style>
     body {
            font-size: 12px !important;
            font-family: Verdana !important;
               }
	</mj-style>
  </mj-head>
8

Maybe, but if you use this expression you hardcode every text as 12px

9

That is true …

10

body class didn’t work …

11

Hi

What about mj-breakpoint?
Isn’t it quite important to achieve full responsiveness?

Any workarounds to achieve a responsive layout?

12

Not sure what you are trying to achieve, but maybe try grouping?

13

When I resize my browser to test if a page will switch to a different layout, the switch never happens because breakpoint doesn’t work

14

Let’s understand.
Are you building page or email?

15

Hi joeyk, I’m working with fr500 on this. We are building an email, using mjml to create the template.

When the template is opened in the grapes email builder, the email does not break from the desktop to the mobile version at the right place. The breakpoint is set for 600px, but the email does not break to the mobile version until 480px, which is too narrow for our content.

How can we make the columns stack at a wider width? Using does not seem to do anything.

Thanks!

16

Hey,
I hear you.
I have no idea, but I would look in mjml forums. The builder should be following mjml standards in this matter.