TJML Framework
Емейл фреймворк для создания адаптивных HTML и AMP писем.
Loading animation...
Адаптивно
Фреймворк по умолчанию формирует адаптивную верстку письма
Быстро
Время верстки с Pixcraft Framework сокращается в 2 раза
Просто
Pixcraft Framework снижает порог вхождения в емейл-верстку
Качественно
Письма отлично отображаются во всех современных почтовых клиентах
Подробнее на Хабр| TJML | MJML | Foundation for Email | |
|---|---|---|---|
| Поддержка AMP | + | - | - |
| Поддержка медиа-запросов | + | + | + |
| Работа без медиа-запросов | + | - | - |
| Корректное отображение в Outlookвключая Outlook 120 dpi | + | + | - |
| Онлайн playground | + | + | - |
| Не нужен сборщик | + | Зависит от IDE | - |
| Тестирование темной темы | + | - | - |
| Инструмент Pixel perfect | + | - | - |
| Бесплатно для использования | + | + | + |
Подключение
1. Добавьте скрипт инициализации в HTML файл
<script type="text/javascript"> var s=document.createElement("script"), l=document.createElement("link"), d=new Date;s.setAttribute("src", "https://app.pixcraft.io/tjml/app.js?ver="+d.getTime()), l.setAttribute("type","text/css"), l.setAttribute("rel","stylesheet"), l.setAttribute("href", "https://app.pixcraft.io/tjml/app.css?ver="+d.getTime()), document.head.appendChild(l), document.body.appendChild(s);</script>2. Вставьте заготовку пустого письма между <body> and </body>
<tjml>
<m-body>
<!-- email code -->
</m-body>
</tjml>
3. Используйте TJML и HTML теги между <m-body> и </m-body>
<m-text> If you don’t want to receive emails from us in the future, click to unsubscribe.<a href="#" target=" blank" style="color:#cc0000"> app.pixcraft.io </a> </m-text>
Или скачайте стартовый пакет с функцией автозавершения для WebStorm и phpStrorm