2fe8d3f50e
Expanded the email intro from 3 short paragraphs into 4 semantic blocks,
restoring the marketing-friendly "Tu choisis local..." line that earlier
edits had dropped, plus adding new content about the 3.5 Gbit/s plans
and a "we're right around the corner" CTA framing.
FR intro structure now:
1. "Bonjour {{firstname}},"
2. "Tu choisis local, on veut te remercier. / Comme toi, on aime les
connexions stables et les relations durables." (paired manifesto)
3. "Avec l'arrivée de l'été, voici un cadeau pour toi, disponible
pour un temps limité."
4. "Nous offrons maintenant de nouveaux forfaits, jusqu'à 3.5 Gbit/s.
Que tu souhaites plus de vitesse, battre une autre offre ou juste
nous jaser, on est juste à côté."
EN translation mirrors the same 4-block structure.
Editorial rationale for block grouping in MJML:
- Each block is its own <mj-text> for independent drag-drop in GrapesJS
- Lines that always travel together (manifesto pair, upsell + CTA pair)
share one <mj-text> joined with <br/> to reduce component clutter
- Different styles per block (greeting smaller/secondary, manifesto
larger/bolder, body paragraphs normal) require separate <mj-text>
components anyway since MJML inherits styling per-block
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
145 lines
7.8 KiB
XML
145 lines
7.8 KiB
XML
<mjml>
|
|
<mj-head>
|
|
<mj-title>An exclusive offer from TARGO</mj-title>
|
|
<mj-preview>Just like you, we love stable connections and lasting relationships.</mj-preview>
|
|
<mj-font name="Plus Jakarta Sans" href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap" />
|
|
<mj-font name="Space Grotesk" href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap" />
|
|
<mj-attributes>
|
|
<mj-all font-family="Plus Jakarta Sans, Helvetica, Arial, sans-serif" />
|
|
<mj-body background-color="#F5FAF7" />
|
|
<mj-text color="#1B2E24" line-height="1.5" font-size="16px" />
|
|
<mj-button background-color="#00C853" color="#ffffff" font-weight="700" border-radius="12px" />
|
|
</mj-attributes>
|
|
</mj-head>
|
|
|
|
<mj-body background-color="#F5FAF7" width="600px">
|
|
|
|
<!-- ════════ HEADER LOGO ════════ -->
|
|
<mj-section background-color="#ffffff" border="1px solid #e5e7eb" border-bottom="none" border-radius="12px 12px 0 0" padding="28px 36px 22px">
|
|
<mj-column>
|
|
<mj-image src="https://xqy3m.mjt.lu/img2/xqy3m/eed4d18c-8065-4c5f-b47c-58af63171cd0/content"
|
|
alt="TARGO" width="140px" align="left" padding="0" />
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ GREETING + INTRO (4 semantic blocks) ════════
|
|
Block 1 — Personalized greeting
|
|
Block 2 — TARGO brand manifesto (paired hook lines)
|
|
Block 3 — Gift announcement
|
|
Block 4 — Plans upsell + invitation to reach out -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="26px 36px 18px">
|
|
<mj-column>
|
|
<mj-text color="#374151" font-size="16px" padding-bottom="14px">Hi {{firstname}},</mj-text>
|
|
|
|
<mj-text font-size="17px" font-weight="500" color="#1B2E24" line-height="1.55" padding-bottom="14px">
|
|
Going local — we want to say thanks.<br />
|
|
Just like you, we love stable connections and lasting relationships.
|
|
</mj-text>
|
|
|
|
<mj-text color="#374151" padding-bottom="14px">
|
|
Summer's here, and we have a <strong>limited-time gift for you</strong>.
|
|
</mj-text>
|
|
|
|
<mj-text color="#374151" padding-bottom="0">
|
|
We now offer new plans, up to <strong>3.5 Gbit/s</strong>.<br />
|
|
Whether you want more speed, want to beat another offer, or just want to chat — we're right around the corner.
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ COMPACT INFO CARD ════════ -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" padding="18px 36px 22px">
|
|
<mj-column background-color="#F5FAF7" border-radius="10px" padding="18px 22px">
|
|
<mj-text font-weight="700" color="#1B2E24" padding="0 0 8px">🎁 {{amount}} at hundreds of brands</mj-text>
|
|
<mj-text color="#64748B" font-size="14px" padding="0 0 4px">⚡ Instant on activation</mj-text>
|
|
<mj-text color="#64748B" font-size="14px" padding="0">🤝 Stay with us {{commitment_months}}+ months</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ OPTION 1 CHIP ════════ -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="18px 36px 8px">
|
|
<mj-column>
|
|
<mj-text padding="0">
|
|
<span style="display:inline-block;background:#E6F9EE;color:#00C853;font-size:13px;font-weight:700;padding:5px 12px;border-radius:6px;">✅ Option 1</span>
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ BIG GREEN CTA BUTTON ════════ -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" padding="8px 36px">
|
|
<mj-column>
|
|
<mj-button href="{{gift_url}}"
|
|
background-color="#00C853" color="#ffffff"
|
|
inner-padding="30px 24px" border-radius="12px"
|
|
font-size="32px" font-weight="700"
|
|
font-family="Space Grotesk, Helvetica, Arial, sans-serif"
|
|
width="100%">
|
|
🎁 {{amount}}
|
|
</mj-button>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ PRORATA REFUND DISCLAIMER ════════ -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" padding="10px 36px 22px">
|
|
<mj-column>
|
|
<mj-text color="#6b7280" font-size="14px" padding="0">
|
|
🪂 If you leave before {{commitment_months}} months, the prorated amount is refundable.
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ OPTION 2 CHIP + TEXT ════════ -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="18px 36px 6px">
|
|
<mj-column>
|
|
<mj-text padding="0">
|
|
<span style="display:inline-block;background:#F5FAF7;color:#6b7280;font-size:13px;font-weight:700;padding:5px 12px;border-radius:6px;">⏭️ Option 2</span>
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" padding="6px 36px 22px">
|
|
<mj-column>
|
|
<mj-text color="#4b5563" font-size="15px" line-height="1.55" padding="0">
|
|
Do nothing. Your monthly subscription continues as usual — no commitment, no gift card.
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ SIGNATURE ════════ -->
|
|
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-bottom="1px solid #e5e7eb" border-top="1px solid #eef0ee" border-radius="0 0 12px 12px" padding="18px 36px 28px">
|
|
<mj-column>
|
|
<mj-text color="#1B2E24" font-size="15px" padding="0">🤝 Thanks for helping our regional economy thrive!</mj-text>
|
|
<mj-text color="#64748B" font-size="14px" padding="8px 0 0">The TARGO team</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ CONTACT INFO ════════ -->
|
|
<mj-section padding="18px 36px 8px">
|
|
<mj-column>
|
|
<mj-text align="center" color="#64748B" font-size="12px" line-height="1.55" padding="0">
|
|
You're getting this email because you're a TARGO customer at <strong style="color:#1B2E24;">{{description}}</strong>.<br />
|
|
Got a question? Write to
|
|
<a href="mailto:support@targo.ca" style="color:#00C853;text-decoration:none;">support@targo.ca</a>
|
|
or call
|
|
<a href="tel:5144480773" style="color:#00C853;text-decoration:none;">514 448-0773</a>.
|
|
Support 7 days/week.
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
<!-- ════════ DARK FOOTER BAND ════════ -->
|
|
<mj-section background-color="#1C1E26" border-radius="12px" padding="26px 36px 22px">
|
|
<mj-column>
|
|
<mj-image src="https://xqy3m.mjt.lu/img2/xqy3m/eed4d18c-8065-4c5f-b47c-58af63171cd0/content"
|
|
alt="TARGO" width="120px" align="center" padding="0" />
|
|
<mj-text align="center" color="rgba(255,255,255,0.55)" font-size="11px" line-height="1.55" padding="18px 0 0">
|
|
<a href="https://www.targo.ca" style="color:rgba(255,255,255,0.7);text-decoration:none;">www.targo.ca</a>
|
|
· 1867 ch. de la rivière, Ste-Clotilde, QC<br />
|
|
© {{year}} TARGO Communications · All rights reserved.
|
|
</mj-text>
|
|
</mj-column>
|
|
</mj-section>
|
|
|
|
</mj-body>
|
|
</mjml>
|