Solved

Table in Send an email action

  • 5 June 2023
  • 9 replies
  • 204 views

Userlevel 1
Badge +7

Hi 

When i am adding a table in the send an email action, the table is always not in line with the email body, either too much space between the bottom of the table and the next paragraph, or the words are next to the table. Is there any way to fix it? Thank you!

For example, if i have the below in the setting, the actual email will have 7-8 empty lines until the next paragraph.

 

icon

Best answer by Jake 6 June 2023, 16:47

View original

9 replies

Userlevel 6
Badge +16

Hi @mjliu 

To refine the HTML Table, you need to toggle into HTML Editor mode to edit the HTML

 

<table style="width: 650px;" cellspacing="1" cellpadding="5" border="0">

 

Userlevel 5
Badge +11

Hi @mjliu 

 

To add to @Garrett ‘s response, you can set the table to always meet the full width of the email by setting width: to 100%

 

for example.

 

Now you can see the table will stretch.

 

 

You can then go into the HTML view to give specific values for more tailored view, for example if I want the first row to be smaller again I can use percentages by adding style="width: 25%" to the column you want, this will make that column 25% of the full width of the table as shown below.

 

 

Userlevel 6
Badge +16

Hi @mjliu 

I craft this template for your perusal

All you need to do is to insert the variables into the cells

 

Toggle to HTML mode. Paste the following code

<p>&nbsp;</p>

<table style="width: 650px;" cellspacing="1" cellpadding="5" border="1">
<tbody>
<tr>
<td style="text-align: center; background-color: Gainsboro;" colspan="3"><strong>Schedule of the Induction Meetings</strong></td>
</tr>
<tr>
<td style="text-align: center;"><strong>Team</strong></td>
<td style="text-align: center;"><strong>Date and time</strong></td>
<td style="text-align: center;"><strong>Attendee(s)</strong></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td style="background-color: Gainsboro;" colspan="3">In addition, you are invited to meet with our&nbsp; Team fror an Introduction&nbsp; of the</td>
</tr>
</tbody>
</table>

<p>&nbsp;</p>

Toggle off the HTML Mode. You should see the table at above

 

Tested. Send email to my Outlook

 

Use @Jake great suggestion of fixing the column width. Thank Jake!!

Adjust the HTML Table width to fit your needs. Use fixed width (650px) or dynamic width (100%)

Userlevel 1
Badge +7

Thanks a lot everyone!! Really appreciate it!

Userlevel 5
Badge +19

Hi @mjliu 
Please remember to mark the best answer! :) 

Userlevel 4
Badge +11

@Garrett  do you nkow how to make the border flat so it doesn’t look so raised like that? 

This was a good share, appreciate it, helped alot! We had to update our email templates to align with internal branding guidelines. I need help making the lines FLAT, and not raised using basic HTML code. All I can find is CSS stuff that isn’t translating in send an email action. :(

 

Userlevel 6
Badge +16

Hi @brandiwoodson 

Try adding this.

<table style="width: 650px;border-collapse:collapse;" cellspacing="1" cellpadding="5" border="1">

 

<p>&nbsp;</p>

<table style="width: 650px;border-collapse:collapse;" cellspacing="1" cellpadding="5" border="1">
<tbody>
<tr>
<td style="text-align: center; background-color: Gainsboro;" colspan="3"><strong>Schedule of the Induction Meetings</strong></td>
</tr>
<tr>
<td style="text-align: center;"><strong>Team</strong></td>
<td style="text-align: center;"><strong>Date and time</strong></td>
<td style="text-align: center;"><strong>Attendee(s)</strong></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td style="background-color: Gainsboro;" colspan="3">In addition, you are invited to meet with our Team for an Introduction of the</td>
</tr>
</tbody>
</table>

<p>&nbsp;</p>

 

Tested with JSFiddle. 
You may have to tweak code for Outlook client

Userlevel 4
Badge +11

@Garrett Thanks for the share for this! Hey I ran into another problem with our new internal guidelines. How do I force everything in the table (highest level) to be Lato at size 14? The issue in NAC I’m running into is that when users post the code I created for the final product, the intent is to use it as a template. If they clear the text out, it then jumps back to the default NAC font size and family which I’m concerned users wont’ notice it went back and they need to change it. I know how to do it on the row level but I need something that overrides the entire table and NOT specify anything on the row level! 

Userlevel 4
Badge +11

Here is my issue. I set everything the way I want it, everything at 14 and Lato. 

The intent is other users will be using these txt files and pasting them into the “send an email” action as a “template” to use, they will just replace the text in the message body. 

 



It’s difficult because when they paste it in html and switch it back, the empty breaks or spaces resort back to open sans and default size. >:|

After it’s pasted in from a blank canvas using HTML. 

 



Here is the code I’m using for this one, which is simply generated from NAC. Was unclear how to add attributes or properties to force the entire table vs each row. :(
 

<table style="width: 700px;" cellspacing="1" cellpadding="1" border="0">
<tbody>
<tr>
<td>
<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">[Message Body Section Start]</span></span></p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Dear Designer, </span></span></p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Please use this template as an example and a guide to visualize what the final output of all emails generated from this system should look like to maintain a cohesive look across all processes/initiatives developed by all users. </span></span></p>

<p>&nbsp;</p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;"><span style="color:#0052a3;"><b>Email Requirements:&nbsp;</b></span></span></span></p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">To maintain compliance with Marketing guidelines and procedures, all emails sent using Nintex Automation Cloud must adhere to the below email guidelines. </span></span></p>

<ul>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Message Body Requirements are are followed: </span></span>

<ul>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Font size = 14</span></span></li>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Family = Lato</span></span></li>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Style = Regular (primarly use regular. However, you may use bold, italics or underline&nbsp;etc. to emphasis information in the email, as needed.)</span></span></li>
</ul>
</li>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Header Requirements</span></span>
<ul>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Font Size = 16</span></span></li>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Family = Lato</span></span></li>
<li><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Style = Bold</span></span></li>
</ul>
</li>
</ul>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;"><span style="color:#e60000;"><strong>Instructions: </strong></span></span></span></p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Please replace the text illustrated throughout this template in the "Message Body Section Start and Message Body Section End" with text that is specific&nbsp;to your business needs. Reference <a href="https://kbrcorp.sharepoint.com/sites/AutomationDigitalSolutionsMSNintex.P.CORP.IN.CI.US.Team/SitePages/Nintex-Portal.aspx">Nintex Portal</a>&nbsp;to find additional resources regarding workflow design requirements as it relates to email communications.</span></span></p>

<p>&nbsp;</p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">If you have any questions regarding these requirements,&nbsp;please post your question through&nbsp;<a href="https://web.yammer.com/main/org/kbr.com/groups/eyJfdHlwZSI6Ikdyb3VwIiwiaWQiOiIxMzAzNDEwNTI0MTYifQ/all">Nintex Corner</a>.</span></span></p>

<p>&nbsp;</p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Regards,&nbsp;</span></span></p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">Microsoft Cloud Applications Team</span></span></p>

<p><span style="font-size:14px;"><span style="font-family:Lato,Helvetica,Arial,sans-serif;">[Message Body Section End]</span></span></p>
</td>
</tr>
</tbody>
</table>




 

Reply