How to Inline CSS Styles in Email Mailers Using premailer-rails
Channel: Mike Rogers
Date: 2021-02-16

Did you know you can inline CSS in Ruby on Rail's mailers using the premailer-rails gem? You just need to drop it in & it'll just work!

You can also use postcss-css-variables to calculate the value of CSS Variables, so they'll fallback perfectly in older email clients such as Outlook.

# Sources

➡ postcss-css-variables: https://github.com/MadLittleMods/postcss-css-variables
➡ premailer-rails: https://github.com/fphilipe/premailer-rails
➡ Source Code: https://github.com/MikeRogers0-YouTube/premailer-rails-demo

# Chapters

0:00 - What are we going to do?
0:10 - Expedited WAF 
0:35 - Why Inline CSS Styles?
1:18 - What is the current mailer setup
2:20 - Adding premailer-rails
3:19 - Using postcss-css-variables for CSS Variables
5:15 - Easy plain text emails
5:51 - Thank You

# Episode Sponsor

Today episode was sponsored by https://elements.heroku.com/addons/expeditedwaf

# Follow Me Online

➡ Blog: https://mikerogers.io/
➡ Twitter: https://twitter.com/MikeRogers0
➡ GitHub: https://github.com/mikerogers0
➡ YouTube: https://www.youtube.com/c/MikeRogers0
➡ BuyMeACoffee: https://www.buymeacoffee.com/MikeRogers0
➡ Dev.to: https://dev.to/mikerogers0

#RubyOnRails #EmailMailers #AwesomeRubyGems