Embedding CSS file in html e-mail
Embedding CSS file in html e-mail
Sending html e-mails opens a whole can of worms on the many ways e-mail can be viewed. There is also no guarantee your e-mail will look as intended.
Instead of linking to a remote css file that may be blocked, or prompt the user with a scary ‘prevented external content to load’ error message, we can use PHP to pull the file directly. This adheres to the DRY principle and keeps the code base clean.
Use the file_get_contents function in place of linking a style sheet via an html style element.
I would also recommend a try/catch block in case the file_get_contents command fails.
Solution
In head section:
| 12345 | <style type="text/css" media="screen"><!-- we do this to embed the file contents into the e-mail.<?php echo file_get_contents("../common/css/blueprint/screen.css"); ?>--></style> |
| — | — |
Author’s Note
Initial md Generated using https://github.com/jsr6720/wordpress-html-scraper-to-md
Original Wordpress categories: [‘PHP’]
Original Wordpress tags: “PHP”, “clean code”, “CSS”, “email”, “embed”, “php”
Original Wordpress comments: None
Significant revisions
tags: 2011, wordpress, txcowboycoder, php, clean-code, css, email
- May 6th, 2024 Converted to jekyll markdown format and copied to personal site
- Jul 13th, 2011 Originally published on txcowboycoder wordpress site