louis/gigafibre-fsm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(campaigns/templates): richer 4-block intro (greeting, hook, gift, upsell)

Browse Source 
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>
This commit is contained in:
louispaulb 2026-05-21 22:44:16 -04:00
parent 79ae38db60
commit 2fe8d3f50e
8 changed files with 160 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
scripts/campaigns/templates/gift-email-en.html
View File

@ -138,7 +138,11 @@
<!--[if mso | IE]></td></tr></table><![endif]-->
<!-- ════════ GREETING + BRAND LINE ════════ -->
<!-- ════════ 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 -->
<!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
@ -151,7 +155,7 @@
<tbody>
<tr>
<td
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 0;text-align:center;"
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 18px;text-align:center;"
>
<!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:526px;" ><![endif]-->
@ -182,8 +186,21 @@
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.5;text-align:left;color:#1B2E24;"
>Just like you, we love stable connections and lasting relationships.</div>
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.55;text-align:left;color:#1B2E24;"
>Going local — we want to say thanks.<br />
Just like you, we love stable connections and lasting relationships.</div>
</td>
</tr>
<tr>
<td
align="left" style="font-size:0px;padding:10px 25px;padding-bottom:14px;word-break:break-word;"
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Summer's here, and we have a <strong>limited-time gift for you</strong>.</div>
</td>
</tr>
@ -195,7 +212,8 @@
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Summer's here, and so is your <strong>limited-time exclusive offer</strong>:</div>
>We now offer new plans, up to <strong>3.5&nbsp;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.</div>
</td>
</tr>

20
scripts/campaigns/templates/gift-email-en.mjml
View File

@ -22,15 +22,27 @@
</mj-column>
</mj-section>
<!-- ════════ GREETING + BRAND LINE ════════ -->
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="26px 36px 0">
<!-- ════════ 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" padding-bottom="14px">
<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">
Summer's here, and so is your <strong>limited-time exclusive offer</strong>:
We now offer new plans, up to <strong>3.5&nbsp;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>

29
scripts/campaigns/templates/gift-email-fr.html
View File

@ -138,7 +138,12 @@
<!--[if mso | IE]></td></tr></table><![endif]-->
<!-- ════════ GREETING + BRAND LINE ════════ -->
<!-- ════════ GREETING + INTRO (4 blocs sémantiques) ════════
Bloc 1 — Greeting personnalisé
Bloc 2 — Manifeste brand TARGO (2 lignes qui voyagent ensemble)
Bloc 3 — Annonce du cadeau
Bloc 4 — Upsell forfaits + invitation contact
Chaque bloc est un mj-text indépendant = drag-droppable séparément. -->
<!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
@ -151,7 +156,7 @@
<tbody>
<tr>
<td
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 0;text-align:center;"
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 18px;text-align:center;"
>
<!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:526px;" ><![endif]-->
@ -182,8 +187,21 @@
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.5;text-align:left;color:#1B2E24;"
>Comme toi, on aime les connexions stables et les relations durables.</div>
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.55;text-align:left;color:#1B2E24;"
>Tu choisis local, on veut te remercier.<br />
Comme toi, on aime les connexions stables et les relations durables.</div>
</td>
</tr>
<tr>
<td
align="left" style="font-size:0px;padding:10px 25px;padding-bottom:14px;word-break:break-word;"
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Avec l'arrivée de l'été, voici un <strong>cadeau pour toi, disponible pour un temps limité</strong>.</div>
</td>
</tr>
@ -195,7 +213,8 @@
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Avec l'arrivée de l'été, voici ton <strong>offre exclusive pour un temps limité</strong> :</div>
>Nous offrons maintenant de nouveaux forfaits, jusqu'à <strong>3.5&nbsp;Gbit/s</strong>.<br />
Que tu souhaites plus de vitesse, battre une autre offre ou juste nous jaser, on est juste à côté.</div>
</td>
</tr>

21
scripts/campaigns/templates/gift-email-fr.mjml
View File

@ -22,15 +22,28 @@
</mj-column>
</mj-section>
<!-- ════════ GREETING + BRAND LINE ════════ -->
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="26px 36px 0">
<!-- ════════ GREETING + INTRO (4 blocs sémantiques) ════════
Bloc 1 — Greeting personnalisé
Bloc 2 — Manifeste brand TARGO (2 lignes qui voyagent ensemble)
Bloc 3 — Annonce du cadeau
Bloc 4 — Upsell forfaits + invitation contact
Chaque bloc est un mj-text indépendant = drag-droppable séparément. -->
<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">Bonjour {{firstname}},</mj-text>
<mj-text font-size="17px" font-weight="500" color="#1B2E24" padding-bottom="14px">
<mj-text font-size="17px" font-weight="500" color="#1B2E24" line-height="1.55" padding-bottom="14px">
Tu choisis local, on veut te remercier.<br />
Comme toi, on aime les connexions stables et les relations durables.
</mj-text>
<mj-text color="#374151" padding-bottom="14px">
Avec l'arrivée de l'été, voici un <strong>cadeau pour toi, disponible pour un temps limité</strong>.
</mj-text>
<mj-text color="#374151" padding-bottom="0">
Avec l'arrivée de l'été, voici ton <strong>offre exclusive pour un temps limité</strong> :
Nous offrons maintenant de nouveaux forfaits, jusqu'à <strong>3.5&nbsp;Gbit/s</strong>.<br />
Que tu souhaites plus de vitesse, battre une autre offre ou juste nous jaser, on est juste à côté.
</mj-text>
</mj-column>
</mj-section>

28
services/targo-hub/templates/gift-email-en.html
View File

@ -138,7 +138,11 @@
<!--[if mso | IE]></td></tr></table><![endif]-->
<!-- ════════ GREETING + BRAND LINE ════════ -->
<!-- ════════ 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 -->
<!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
@ -151,7 +155,7 @@
<tbody>
<tr>
<td
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 0;text-align:center;"
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 18px;text-align:center;"
>
<!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:526px;" ><![endif]-->
@ -182,8 +186,21 @@
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.5;text-align:left;color:#1B2E24;"
>Just like you, we love stable connections and lasting relationships.</div>
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.55;text-align:left;color:#1B2E24;"
>Going local — we want to say thanks.<br />
Just like you, we love stable connections and lasting relationships.</div>
</td>
</tr>
<tr>
<td
align="left" style="font-size:0px;padding:10px 25px;padding-bottom:14px;word-break:break-word;"
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Summer's here, and we have a <strong>limited-time gift for you</strong>.</div>
</td>
</tr>
@ -195,7 +212,8 @@
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Summer's here, and so is your <strong>limited-time exclusive offer</strong>:</div>
>We now offer new plans, up to <strong>3.5&nbsp;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.</div>
</td>
</tr>

20
services/targo-hub/templates/gift-email-en.mjml
View File

@ -22,15 +22,27 @@
</mj-column>
</mj-section>
<!-- ════════ GREETING + BRAND LINE ════════ -->
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="26px 36px 0">
<!-- ════════ 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" padding-bottom="14px">
<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">
Summer's here, and so is your <strong>limited-time exclusive offer</strong>:
We now offer new plans, up to <strong>3.5&nbsp;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>

29
services/targo-hub/templates/gift-email-fr.html
View File

@ -138,7 +138,12 @@
<!--[if mso | IE]></td></tr></table><![endif]-->
<!-- ════════ GREETING + BRAND LINE ════════ -->
<!-- ════════ GREETING + INTRO (4 blocs sémantiques) ════════
Bloc 1 — Greeting personnalisé
Bloc 2 — Manifeste brand TARGO (2 lignes qui voyagent ensemble)
Bloc 3 — Annonce du cadeau
Bloc 4 — Upsell forfaits + invitation contact
Chaque bloc est un mj-text indépendant = drag-droppable séparément. -->
<!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
@ -151,7 +156,7 @@
<tbody>
<tr>
<td
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 0;text-align:center;"
style="border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-top:1px solid #eef0ee;direction:ltr;font-size:0px;padding:26px 36px 18px;text-align:center;"
>
<!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:526px;" ><![endif]-->
@ -182,8 +187,21 @@
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.5;text-align:left;color:#1B2E24;"
>Comme toi, on aime les connexions stables et les relations durables.</div>
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:17px;font-weight:500;line-height:1.55;text-align:left;color:#1B2E24;"
>Tu choisis local, on veut te remercier.<br />
Comme toi, on aime les connexions stables et les relations durables.</div>
</td>
</tr>
<tr>
<td
align="left" style="font-size:0px;padding:10px 25px;padding-bottom:14px;word-break:break-word;"
>
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Avec l'arrivée de l'été, voici un <strong>cadeau pour toi, disponible pour un temps limité</strong>.</div>
</td>
</tr>
@ -195,7 +213,8 @@
<div
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5;text-align:left;color:#374151;"
>Avec l'arrivée de l'été, voici ton <strong>offre exclusive pour un temps limité</strong> :</div>
>Nous offrons maintenant de nouveaux forfaits, jusqu'à <strong>3.5&nbsp;Gbit/s</strong>.<br />
Que tu souhaites plus de vitesse, battre une autre offre ou juste nous jaser, on est juste à côté.</div>
</td>
</tr>

21
services/targo-hub/templates/gift-email-fr.mjml
View File

@ -22,15 +22,28 @@
</mj-column>
</mj-section>
<!-- ════════ GREETING + BRAND LINE ════════ -->
<mj-section background-color="#ffffff" border-left="1px solid #e5e7eb" border-right="1px solid #e5e7eb" border-top="1px solid #eef0ee" padding="26px 36px 0">
<!-- ════════ GREETING + INTRO (4 blocs sémantiques) ════════
Bloc 1 — Greeting personnalisé
Bloc 2 — Manifeste brand TARGO (2 lignes qui voyagent ensemble)
Bloc 3 — Annonce du cadeau
Bloc 4 — Upsell forfaits + invitation contact
Chaque bloc est un mj-text indépendant = drag-droppable séparément. -->
<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">Bonjour {{firstname}},</mj-text>
<mj-text font-size="17px" font-weight="500" color="#1B2E24" padding-bottom="14px">
<mj-text font-size="17px" font-weight="500" color="#1B2E24" line-height="1.55" padding-bottom="14px">
Tu choisis local, on veut te remercier.<br />
Comme toi, on aime les connexions stables et les relations durables.
</mj-text>
<mj-text color="#374151" padding-bottom="14px">
Avec l'arrivée de l'été, voici un <strong>cadeau pour toi, disponible pour un temps limité</strong>.
</mj-text>
<mj-text color="#374151" padding-bottom="0">
Avec l'arrivée de l'été, voici ton <strong>offre exclusive pour un temps limité</strong> :
Nous offrons maintenant de nouveaux forfaits, jusqu'à <strong>3.5&nbsp;Gbit/s</strong>.<br />
Que tu souhaites plus de vitesse, battre une autre offre ou juste nous jaser, on est juste à côté.
</mj-text>
</mj-column>
</mj-section>