Email Table Module

tel_mark
Participant

I've written a custom module for tables in emails if anyone is interested...

 

<div datahss-responsive-table="true" style="overflow-x: auto; max-width: 100%; width: 100%; margin-left: auto; margin-right: auto;">
<table style="width:100%;border:{{ module.border_width }}px solid {{ module.border_color.color }};" cellpadding="4">
  <tr>
    {% for each_header in module.headers %}
    <td style="background-color:{{ module.header_background_color.color }}; border:{{ module.border_width }}px solid {{ module.border_color.color }};">
      {{ each_header.header_text }}
    </td>
    {% endfor %}
  </tr>
  {% for each_row in module.rows %}
  <tr>
  {% for each_cell in each_row.cells %}
    <td style="background-color:{{ module.table_background_color.color }}; border:{{ module.border_width }}px solid {{ module.border_color.color }};">
      {{ each_cell.cell_text }}
    </td>
  {% endfor %}
  </tr>
  {% endfor %}
</table>
</div>

 

Field Groups/Fields

Headers (Field group) [headers] Repeater 0-5 Default 1
|__ Header text (Rich text) [header_text]
Rows (Field group) [rows] Repeater 0-∞ Default 2
|__ Cells (Field group) [cells] Repeater 0-5 Default 1
    |__ Cell text (Rich text) [cell_text]
Border width (Number) [border_width]
Border color (Color) [border_color]
Header background color (Color) [header_background_color]
Table background color (Color) [table_background_color]

 

It seems to work OK - any feedback / extra features would be welcome 😊

2 Replies 2
natsumimori
Community Manager

Hi @tel_mark ,

 

Thank you for sharing this in the Community!

@KTownsend @Alex_ @MFrankJohnson I thought you guys might be interested in this😃

0 Upvotes
MFrankJohnson
Thought Leader

Thanks for the ping @natsumimori ... and for the work @tel_mark ... will share internally. 😎

 

Note: The date of each post here is increasingly important as HubSpot evolves to be the #1 CRM platform of choice world-wide.

-- Visit

 

Hope that helps.

 

Be well,
Frank


HubSpot's Hiring World-Wide!