Elixir Phoenix email render css and layout

Question

I just wrote a phoenix email renderer. When i send the email through the app, the external css does not get rendered and also the mailer.html layout was not picked up.

Am i doing something wrong below?

  def invitation_email(conn, to_email) do
    html = View.render_to_string(MailerView, "invitation.html", layout: {LayoutView, "mailer.html"}, conn: conn)
    send_email to: to_email,
               from: "hi@#{conn.host}",
               subject: "Invitation from #{conn.host}!",
               html: html
  end

Answer 1

This looks good to me. Are you sure it's not just the email client that doesn't load the css? I think most won't load external css, so you need to put it into a <style> tag.

I would put an IO.inspect(html) after the html = ... line and check the output when calling that function. Does that include the layout and the css?

Answer 2

We also had this problem at the startup I am working for, and the problem is probably that the styles are not inlined. Some email clients do not support style sheets so you have to specify the css styles in each tag. I recently released Smoothie, that does this inline style transformation automatically, so the html templates can stay clean. Additionally, it also creates a plain text version of the html emails.