Парсер для верстки EMail письма

271

10 декабря 2016, 10:43

Доброго всем времени суток.

Стала задача написать утилиту для рассылки писем. С самой утилитой вобщем то проблем нет. Есть проблемы с версткой писем.

Как известно, HTML верстка самого письма - вещь не тривиальная, так как она отличается от обычной HTML верстки обычных страниц в части поддержки различных фич.

Самая большая проблема, это отсутствие поддержки <style> в <head> для GMail (подробнее тут). Т.е. как вы понимаете, нельзя набросать общие CSS стили для элементов по селекторам. Эти стили нужно прописывать к каждому элементу через атрибут style="".

Очень здорово эта задача решается у mailchimp.com. У них есть встроенный парсер, который парсит тег <style> и вешает стили к соответствующим элементам. Т.е. вот такое письмо:

...
<style>
a { color: green; }
a.someLink { color: red; }
</style>
...
<body>
...
<a class="someLink">first</a>
<a class="anotherClass">second</a>
<a>third</a>
...

Преобразуется к виду:

...
<style>
a { color: green; }
a.someLink { color: red; }
</style>
...
<body>
...
<a class="someLink" style="color: red;">first</a>
<a class="anotherClass" style="color: green;">second</a>
<a style="color: green;">third</a>
...

Это очень круто, и это то чего надо бы нам добиться. Суть в том что у письма есть стилизованный шаблон и предполагается что его контентная письма редактируется с помощью WYSIWYG редактора. Т.е. контент у письма получается в виде HTML, но из за отсутствии поддержки тега <style>, контент не форматируется в соответствии со стилем самого шаблона.

Самый идеальный вариант это найти какой то инструмент с помощью которого можно было бы делать то же самое что делает mailchimp. Т.е. какой то парсер DOM и CSS, который отдает DOM с навешанными стилями. Может кто знает про что то похожее?

PS: в идеале бы конечно на PHP :)

Answer 1

Воспользуйтесь инструментами, которые предлагает Zurb Foundation.
Там есть и шаблонизатор, который позволяет писать меньше кода (например, колоночная система, которая из одного тега автоматически разворачивается в фарш из таблиц), и инлайнер (то, о чём вы спрашиваете).

Они поставляются в виде npm-пакетов, но никто не мешает вам установить их и вызывать из своего кода на php. На чём написаны сами инструменты, по идее, вам должно быть неважно.