What are transformers?
Transformers in Maizzle are functions that basically take a string of HTML, do something with it, and then return it for further processing. They run after your Template has been compiled and allow you to manipulate the HTML in various ways, like prepending a base URL to all<img> tags or preventing widow words.
Some of the Transformers help you automate tedious tasks that are required when developing HTML emails, like inlining CSS, automatically adding attributes for better accessibility, or generating plaintext versions of your emails.
Transformers list
Most Transformers are enabled by default:- Safe Class Names - rewrites Tailwind CSS class names to email-safe alternatives
- Filters - Liquid-like filters as HTML attributes
- Markdown - converts Markdown to HTML
- Prevent Widows - enables an HTML attribute that prevents widow words
- Add Attributes - improves accessibility by adding
altandroleattributes - Remove Attributes - removes empty
styleandclassattributes - Six-digit HEX - converts 3-digit HEX colors to 6-digit
- Outlook Tags - simplifies writing MSO conditionals for Outlook
- resolveProps - resolves CSS variables to their static values
- resolveCalc - resolves CSS
calc()functions to their static values
config.js:
- Inline CSS - inlines CSS styles into the HTML
- Purge CSS - removes unused CSS classes from your HTML
- Shorthand CSS - converts long-hand CSS to shorthand in
styleattributes - Base URL - prepends a string to configured attributes in HTML
- URL parameters - adds URL parameters to configured HTML tags
- Replace strings - replaces strings through regular expressions
- Prettify - pretty-prints the HTML
- Minify - minifies the HTML
Disabling
You may disable all Transformers by settinguseTransformers to false:
config.js