Solved
Copilot Email Formatting
I'm having some challenges with formatting Copilot emails when they include tokens or links. When the email is sent, the tokens and links show up in a different font and size. I've been able to get around it by trying to match the font and size as closely as possible, but it's still noticeably different. Has anyone else experienced this?
Best answer by dan_ahrens
What often takes place when admins build email templates is they start in a document editor like MS Word or Google Docs to build out the text, links, etc and then cut and paste it into Gainsight. What they don't realize is that the word processing application adds a whole bunch of extra HTML tags that end up causing problems down the road.
Here are two examples of the same text. One was entered and built directly in JO and the other was built first in MS Word and then pasted into JO.
Can you see the difference in HTML formatting tags in just the first few lines of text?
Directly built in JO:
<p class="p1" style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0px;">Hi Abby ,</p>
<p class="p2" style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0px;"><br></p>
<p class="p1" style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0px;">I'm a member of the Customer Success Team and wanted to send a quick email to provide you with an updated list of key resources.</p>
Built in MS Word and pasted into JO:
<p style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0in 0in 12pt; line-height: 15pt; background: white; vertical-align: baseline;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:#2F3941;">Hi Abby,</span></p>
<p style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0in 0in 12pt; line-height: 15pt; background: white; vertical-align: baseline; outline: 0px; font-variant-ligatures: normal; font-variant-caps: normal; orphans: 2; text-align: start; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; word-spacing: 0px;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:#2F3941;">I'm a member of the Customer
Success Team and wanted to send a quick email to provide you with an updated
list of key resources.</span></p>
And then if you pasted that same text through another text editor, in this case Gmail, then pasted it into JO, things get even more interesting:
<p style="padding-top: 0px; padding-bottom: 0px; color: rgb(34, 34, 34); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; margin: 0in 0in 12pt; line-height: 15pt; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; vertical-align: baseline; font-size: 12pt; font-family: "Times New Roman", serif;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:rgb(47, 57, 65);">Hi Abby,</span></p>
<p style="padding-top: 0px; padding-bottom: 0px; color: rgb(34, 34, 34); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; margin: 0in 0in 12pt; line-height: 15pt; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; vertical-align: baseline; outline: 0px; font-size: 12pt; font-family: "Times New Roman", serif;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:rgb(47, 57, 65);">I'm a member of the Customer Success Team and wanted to send a quick email to provide you with an updated list of key resources.</span></p>
Every one of those extra tags adds complexity and risk that some email client application will choke on that HTML code and display the content inconsistently.
And to show how insidious pasting - paste each of those groups of text into a template and look at the visual differences between these three blocks of text. The differences can be very minimal, but just frustrating enough to have you scratching your head.
Adding to this complexity is the fact that not only do different email clients interpret HTML tags differently, but some clients will alter email content when you forward it as well. Bonkers, right? That's the world of email clients and servers and why companies like Email on Acid have a business model!
Here are two examples of the same text. One was entered and built directly in JO and the other was built first in MS Word and then pasted into JO.
Can you see the difference in HTML formatting tags in just the first few lines of text?
Directly built in JO:
<p class="p1" style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0px;">Hi Abby ,</p>
<p class="p2" style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0px;"><br></p>
<p class="p1" style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0px;">I'm a member of the Customer Success Team and wanted to send a quick email to provide you with an updated list of key resources.</p>
Built in MS Word and pasted into JO:
<p style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0in 0in 12pt; line-height: 15pt; background: white; vertical-align: baseline;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:#2F3941;">Hi Abby,</span></p>
<p style="font-size: 13px; padding-top: 0px; padding-bottom: 0px; margin: 0in 0in 12pt; line-height: 15pt; background: white; vertical-align: baseline; outline: 0px; font-variant-ligatures: normal; font-variant-caps: normal; orphans: 2; text-align: start; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; word-spacing: 0px;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:#2F3941;">I'm a member of the Customer
Success Team and wanted to send a quick email to provide you with an updated
list of key resources.</span></p>
And then if you pasted that same text through another text editor, in this case Gmail, then pasted it into JO, things get even more interesting:
<p style="padding-top: 0px; padding-bottom: 0px; color: rgb(34, 34, 34); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; margin: 0in 0in 12pt; line-height: 15pt; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; vertical-align: baseline; font-size: 12pt; font-family: "Times New Roman", serif;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:rgb(47, 57, 65);">Hi Abby,</span></p>
<p style="padding-top: 0px; padding-bottom: 0px; color: rgb(34, 34, 34); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; margin: 0in 0in 12pt; line-height: 15pt; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; vertical-align: baseline; outline: 0px; font-size: 12pt; font-family: "Times New Roman", serif;"><span style="font-size:10.5pt;font-family:"Helvetica Neue";color:rgb(47, 57, 65);">I'm a member of the Customer Success Team and wanted to send a quick email to provide you with an updated list of key resources.</span></p>
Every one of those extra tags adds complexity and risk that some email client application will choke on that HTML code and display the content inconsistently.
And to show how insidious pasting - paste each of those groups of text into a template and look at the visual differences between these three blocks of text. The differences can be very minimal, but just frustrating enough to have you scratching your head.
Adding to this complexity is the fact that not only do different email clients interpret HTML tags differently, but some clients will alter email content when you forward it as well. Bonkers, right? That's the world of email clients and servers and why companies like Email on Acid have a business model!
Sign up
If you ever had a profile with us, there's no need to create another one.
Don't worry if your email address has since changed, or you can't remember your login, just let us know at community@gainsight.com and we'll help you get started from where you left.
Else, please continue with the registration below.
Welcome to the Gainsight Community
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.

