pagemachine/typo3-mail-css-inliner

CSS inliner for the TYPO3 mailer

1.0.3 2018-07-05 09:50 UTC

README

This extension integrates a CSS inliner into the TYPO3 core mailer.

Installation

This extension is installable from various sources:

  1. Via Composer:

     composer require pagemachine/typo3-mail-css-inliner
    
  2. From the TYPO3 Extension Repository

After installing the extension registers itself as Swiftmailer plugin, no further configuration is necessary.

Purpose

Designing mails is hard. Especially requirements like table layouts and inline styles are complicated to handle and take a lot of time to get right. This extension takes one burden off your shoulders and takes care of turning a regular stylesheet to inline styles. See our blog post about Mail styling in TYPO3 now easier.

Before:

<!doctype html>
<html>
    <head>
        <title>CSS Inline Test</title>
        <style>
            body {
                color: #333;
            }
            h1 {
                font-size: 36px;
            }
            a {
                color: #337ab7;
            }
        </style>
    </head>
    <body>
        <h1>Headline</h1>
        <p>Content with <a href="https://example.org">link</a>.</p>
    </body>
</html>

After:

<html>
  <head>
  <title>CSS Inline Test</title>
  <style>
        body {
            color: #333;
        }
        h1 {
            font-size: 36px;
        }
        a {
            color: #337ab7;
        }
    </style>
    </head>
    <body style="color: #333;">
        <h1 style="font-size: 36px;">Headline</h1>
        <p>Content with <a href="https://example.org" style="color: #337ab7;" target="_blank">link</a>.</p>
    </body>
</html>

Currently only <style> elements are supported, external styles via <link> are not imported.