feat(campaigns/templates): inline merchant logos via simple <img> sequence
The previous attempt (commit 3f72608) tried to inject a nested <table>
of logos, but the anchor selection logic looked for a </p> that didn't
exist — Unlayer renders the amount line inside a <div>, not <p>. As a
result the logos never made it into the templates.
This commit fixes it with a simpler approach: directly append the logo
images to the existing amount-text string. No table nesting, no anchor
hunting — just plain inline-block <img> tags right after the
"🎁 {{amount}} chez des centaines de marques" text.
Markup pattern (inserted right after the amount line, before the
closing </div>):
<br><br>
<span style="display:inline-block;">
<img src="...amazon..." width="32" alt="Amazon" ...>
<img src="...timhortons..." width="32" alt="Tim Hortons" ...>
<img src="...walmart..." width="32" alt="Walmart" ...>
<img src="...homedepot..." width="32" alt="Home Depot" ...>
<img src="...iga..." width="32" alt="IGA" ...>
<img src="...homehardware..." width="32" alt="Home Hardware" ...>
<span style="font-size:13px;color:#64748B;">et plus</span>
</span>
Each <img> uses display:inline-block + vertical-align:middle so they
sit on the same horizontal line. width=32 attribute set for Outlook;
height:auto in style preserves aspect ratio. margin-right:6px provides
spacing between logos. Caption ("et plus" / "and more") at the end.
Width math (inside 484px-wide pill): 6 × (32 + 6) = 228 px + caption
~50 px = 278 px. Fits with margin to spare.
EN translation auto-detected the equivalent anchor and inserted
"and more" instead of "et plus".
Live test-send verified for both FR + EN.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
3f72608a2f
commit
d76a922777
|
|
@ -299,7 +299,7 @@ table, td { color: #1B2E24; } #u_body a { color: #00C853; text-decoration: under
|
|||
|
||||
<div
|
||||
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;font-weight:700;line-height:1.5;text-align:left;color:#1B2E24;"
|
||||
>🎁 {{amount}} chez des centaines de marques</div>
|
||||
>🎁 {{amount}} chez des centaines de marques<br><br><span style="display:inline-block;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/31ffdf91-d2de-4ced-8b99-ad2221695abe/content" width="32" alt="Amazon" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/4b0b2a4a-5f99-416c-8873-8d3e4389b6f7/content" width="32" alt="Tim Hortons" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/14df433d-583c-4602-a403-d47ee84966a6/content" width="32" alt="Walmart" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/b8d3db5a-d39e-43ce-a84a-2f5dddbf0192/content" width="32" alt="Home Depot" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/9c9dfa18-2a3a-414a-b5ad-16d490c961b5/content" width="32" alt="IGA" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/a1e5f032-a192-4499-97ba-53b939712fa9/content" width="32" alt="Home Hardware" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><span style="font-size:13px;color:#64748B;vertical-align:middle;font-weight:400;">et plus</span></span></div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -299,7 +299,7 @@ table, td { color: #1B2E24; } #u_body a { color: #00C853; text-decoration: under
|
|||
|
||||
<div
|
||||
style="font-family:Plus Jakarta Sans, Helvetica, Arial, sans-serif;font-size:16px;font-weight:700;line-height:1.5;text-align:left;color:#1B2E24;"
|
||||
>🎁 {{amount}} chez des centaines de marques</div>
|
||||
>🎁 {{amount}} chez des centaines de marques<br><br><span style="display:inline-block;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/31ffdf91-d2de-4ced-8b99-ad2221695abe/content" width="32" alt="Amazon" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/4b0b2a4a-5f99-416c-8873-8d3e4389b6f7/content" width="32" alt="Tim Hortons" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/14df433d-583c-4602-a403-d47ee84966a6/content" width="32" alt="Walmart" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/b8d3db5a-d39e-43ce-a84a-2f5dddbf0192/content" width="32" alt="Home Depot" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/9c9dfa18-2a3a-414a-b5ad-16d490c961b5/content" width="32" alt="IGA" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><img src="https://xqy3m.mjt.lu/img2/xqy3m/a1e5f032-a192-4499-97ba-53b939712fa9/content" width="32" alt="Home Hardware" style="display:inline-block;border:0;margin-right:6px;vertical-align:middle;height:auto;"><span style="font-size:13px;color:#64748B;vertical-align:middle;font-weight:400;">et plus</span></span></div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user