Hi -
I am using the personalization token for contact owner signature in an email, and the formatting is all wrong. The contact owner signature contains HTML that is not following into the email, and using inline styling is also not correcting the error. There are very wide spaces between each line of the signature I am trying to get rid of in Outlook. HSpace and VSpace do not work. Can someone help?
Hi @GWalsh,
Thanks for reaching out!
Outlook renders the CSS and styling of emails due to its limited support of CSS as mentioned in this help article.
I would like to invite our subject matter experts to our conversation.
Hi @Anton, @piersg, @Teun, @Indra - Do you have any advice for @GWalsh?
Thank you!
Best,
Kristen
Hi @GWalsh,
maybe it’s line-height or something similar.
Could you please share the HTML part?
best,
Anton
Thanks Anton - we are using
<div class=“WordSection1”>
<p class=“MsoNormal”><span style=“font-size: 10.0pt; font-family: ‘Arial’,‘sans-serif’; color: #00728f;”>NAME - GW</span><span style=“font-size: 10.0pt; font-family: ‘Arial’,‘sans-serif’; color: #819f3d;”>&</span><span style=“font-size: 10.0pt; font-family: ‘Arial’,‘sans-serif’; color: #00728f;”>K\ </span><span style=“font-size: 10.0pt; font-family: ‘Arial’,‘sans-serif’; color: #848484;”>Investment Management</span></p>
<p class=“MsoNormal”><strong><span style=“font-size: 8.0pt; font-family: ‘Arial’,‘sans-serif’; line-height: 0.8; color: #848484;”>t:</span></strong><span style=“font-size: 8.0pt; font-family: ‘Arial’,‘sans-serif’; color: #848484;”>PHONE</span></p>
<p class=“MsoNormal”><strong><span style=“font-size: 8.0pt; font-family: ‘Arial’,‘sans-serif’; line-height: 0.8; color: #848484;”>f:</span></strong><span style=“font-size: 8.0pt; font-family: ‘Arial’,‘sans-serif’; color: #848484;”>FAX</span></p>
<p class=“MsoNormal”><span style=“font-size: 8.0pt; font-family: ‘Arial’,‘sans-serif’; color: #848484;”><a href="EMAIL@gwkinvest.com"> EMAIL@gwkinvest.com </a></span></p>
<p class=“MsoNormal”><span style=“font-size: 8.0pt; font-family: ‘Arial’,‘sans-serif’; line-height: 0.8; color: #00728f;”><a href=“http://www.gwkinvest.com”>www.gwkinvest.com</a></span></p>
<p class=“MsoNormal”>\ </p>
</div>
It shows up like this
but in other email templates, we get it to appear like this
Hi @GWalsh,
thank you.
Was this code written/developed by a developer or copy/pasted from somewhere like Word, 3rd party email tool (e.g. stripo) etc.?
Also is it a drag&drop or html mail?
Nontheless try this code:
<p>
<span style="font-size: 12px; font-family: 'Arial','sans-serif'; color: #00728f;">
NAME - GW
</span>
<span style="font-size: 12pxt; font-family: 'Arial','sans-serif'; color: #819f3d;">
&
</span>
<span style="font-size: 12px; font-family: 'Arial','sans-serif'; color: #00728f;">
K
</span>
<span style="font-size: 12px; font-family: 'Arial','sans-serif'; color: #848484;">
Investment Management
</span>
</p>
<p>
<strong style="font-size: 10px; color: #848484;font-family: 'Arial','sans-serif';">
t:
</strong>
<span style="font-size: 10px; color: #848484;font-family: 'Arial','sans-serif';">
PHONE
</span>
</p>
<p>
<strong style="font-size: 10px; color: #848484;font-family: 'Arial','sans-serif';">
f:
</strong>
<span style="font-size: 10px; color: #848484;font-family: 'Arial','sans-serif';">
FAX
</span>
</p>
<p>
<a href="mailto:EMAIL@gwkinvest.com" style="font-size: 10px; font-family: 'Arial','sans-serif';">EMAIL@gwkinvest.com</a>
</p>
<p><a href="http://www.gwkinvest.com" style="font-size: 10px; font-family: 'Arial','sans-serif'; color: #00728f;">www.gwkinvest.com</a>
</p>
<p> </p>
Here are some resources for additional information:
best,
Anton
Moderator note: While this solution may not address the original poster’s specific situation, it could be helpful for other community members facing similar challenges.
Hi Anton,
That still looks the same, so it may just be the way it is being read by outlook. We used a third-party tool and the email is an HTML template with a single module for the main email body. Code below. Thanks!
<!--
templateType: email
isAvailableForNewContent: true
-->
<!doctype html>
<html>
<head style=“ms-text-size-adjust: none; mso-line-height-rule: exactly;”>
<title>{% if content.html_title and content.html_title != ‘’ %}{{ content.html_title }}{% else %}{{ content.body.subject }}{% endif %}</title>
{% if content.meta_description %}<meta name=“description” content=“{{ content.meta_description }}”/>{% endif %}
<style type=“text/css” id=“hs-inline-css”>
/*<![CDATA[*/
/* everything in this style tag will be inlined onto matching elements */
.sample-rule {
}
/*]]>*/
</style>
</head>
<body>
<!-- Insert body here -->
{% module “email_template_main_email_body” path=“@hubspot/email_body” label=“Main Email Body” %}
{{ site_settings.company_name}}
<br/>
{{ site_settings.company_street_address_1}},
{{ site_settings.company_street_address_2}}
{{ site_settings.company_city}},
{{ site_settings.company_state}}
{{ site_settings.company_zip}}
{{ site_settings.company_country}}
<br/>
<br/>
<a style=“font-size: 10px” class=“hubspot-mergetag” data-unsubscribe=“true” href=“{{ unsubscribe_link }}”> Manage preferences</a>
<br/>
<br/>
<p style=“font-family: ‘Times New Roman’, Times, serif; font-size: 10px; line-height: 1;”> This e-mail may contain information that is confidential or privileged. If you are not the intended recipient, please advise the sender immediately and delete this message. </p>
<p style=“font-family: ‘Times New Roman’, Times, serif; font-size: 10px; line-height: 1;”> This e-mail does not constitute an offer or solicitation with respect to the purchase or sale of any security in any jurisdiction in which such offer or solicitation is not authorized or to any person to whom it would be unlawful to make such offer or solicitation. Please click <a href=“https://www.gwkinvest.com/wp-content/uploads/electronic_communication_disclosure.pdf”>here</a> for further disclosures. </p>
</body>
</html>