Within epaPRO you have a few screens where we include screens that you can style using a HTML editor, there is also the option to amend the screen to be HTML code and code it manually.
These screens are:-
Communication Templates - The Communication Templates area allows the style attribute against links. This will allow users to customise emails further with link colour, font size, etc when editing the template using the HTML editor.
News
It is worth mentioning that email clients (e.g. Outlook) do tend to struggle to render code in a consistent format, so what may look fine on the preview screen may be appearing differently once your email client has interpreted it.
HTML Code Examples
Ensuring a URL appears underlined/in blue
To ensure a URL appears in your mail client, as the typical underlined/blue link you could use the HTML editor option on the template - highlighted in yellow
e.g. as Click on Google
and enter the URL like this.
<p><a style="color:#0000EE; text-decoration: underline;" href="https://www.google.co.uk">Click on Google</a></p>
Ensuring the font is all the correct sizes
if you have written your communication template or news article and when viewing it the font appears in different size you can cross reference to check.
Open the HTML editor in epaPRO by clicking on the <> icon
Once you amend to the HTML editor you can see where the font sizes are listed
</p><p>Testing font size 12 to 14 </p><p><span style="font-size:12px;">Apple </span></p><br>
<p><span style="font-size:14px;">Apple</span></p>
Allowing you to check and if needed change the font to all the same size.
Changing Font colours and adding bold text
You can amend the text to be bold within the HTML editor screen in for example the communication templates in epaPRO in one of two ways. The easiest is to use the formatting options within the screen
<strong>{{component_name}}</strong>
Word to HTML converters can help you create your html code, but they can add a lot of junk to the generated code, which could cause a conflict with the styling. It is also heavily dependent on the email client, as some of them will ignore styling in order to fit it into the style of the email client etc.
External Sites that you may find useful
Checking hex code colours
to locate what a colour is in hex code e.g. #000123A you can use a sites:
0 Comments