Hi Durgesh,

I do not use Outlook, nor have I ever had to support sending emails to Outlook users, but: different email clients process HTML email messages differently. It's usually a long process of trial and error to figure out what works for a certain client and what doesn't (or how to work around quirks).

My suggestion is you design your template as you would in OutSystems, send an email using it and analyse the message source in Outlook to understand how is it transforming the HTML+CSS received. Then start adjusting your email design to address those issues. But keep in mind that by targeting one particular email client (like Microsoft Outlook, Apple Mail or Gmail, for instance), you may end up with an email that renders poorly on other clients.

You can check this post for some more information on the topic, I'm sure there are other posts on the Forums regarding this as well, if you search with the right keywords.

Styles work fine with Outlook. If you send your OML we can look and offer some guidance.

J.Ja

Thank you Jorge, Justin for your replies.

@Justin - I tried with many styles on outlook but only style that was working was the background-color, it accepts all styles and shows those on studio but actual email is completely different.

Attached is the oml file  - EmailToHCP is email template used.

Durgesh -

Strange... this looks like it should work? If you open it in Outlook and do a "View Source", what do you see? Can you paste that or attach it? (It took me a while to find the function... double click the email in Outlook to open it in a separate window, then go to "Actions", choose "More Actions", then "View Source")

That said, I recommend using a separate theme for emails, just to avoid having the entire CSS from the theme included, most of which does not apply to emails.

J.Ja

Thanks Justin.

I have attached source file with this.

Thanks,

Durgesh.

Thanks Justin for your time.

I can see styles are present, but for some reason those are not getting applied.

I changed theme to DealCalc, also created another new theme to work.

it seems only one style is getting applied to email and not all that are present with tags. 

Not sure how it overrides styles.

Hi Durgesh,

I've ran into some issues with my CSS in email templates and outlook as well.

Here is a full list of the supported CSS for outlook:

https://docs.microsoft.com/en-us/previous-versions/office/developer/office-2007/aa338201(v=office.12)#supported-html-elements-attributes-and-cascading-style-sheet-properties

I can't quite remember exactly what the specific issue/answer was to my problem, but I remember it being around background colors and certain styles not working correctly in the version of outlook I was testing the email.

The same styles worked across other email platforms (i.e. google).

I suggest taking a look at that list, and the specific styles that aren't working and see what the alternative is to make it work.

Hope it helps,

Justin

EDIT: Realizing that article is for office 2007, will try to find an updated version. But the core issue was the same idea, some CSS didn't work as expected in outlook and needed to be altered to a supported style.

Yes Justin Outlook is ignoring styles, I can see those in the html.

I think we need to follow the outlook rules of styles for this.

Is it possible to capture image by creating colorful screen and then paste that in an email and just send it instead of doing these lot of things ?

Hello Durgesh,

Unfortunately, Outlook doesn't really behave properly with CSS.

You can see an older discussion about that in this topic: https://www.outsystems.com/forums/discussion/15219/email-formating/

In this discussion please notice Samuel's quote: 

"When creating emails, imagine that you are coding in the year 2000: Use tables instead of Divs. CSS3, what's that?

Basically, you need to keep your emails HTML and CSS as simple as possible. 

In order to make your life a bit simpler, we created some UI Patterns specific for emails and 2 sample emails that you can copy and reuse."

Also here's a link about CSS compatibilities in Outlook https://www.campaignmonitor.com/css/email-client/outlook-2007-16/.

About converting your HTML to an image in order to send it to outlook, you would lose any adaptiveness of the email, and we aren't aware of any implementation of the sort, or any forge component that could help you achieve that scenario. Maybe it would be possible by implementing this javascript library https://github.com/bubkoo/html-to-image, but we haven't tested it.

F.Sousa

Thanks Frederico for your reply.