Язык разметки Ampier Framework получил название TJML. Он построен на базе Vue; так что каждый тег TJML является Vue-компонентом. Для начала работы вам необходимо подключить нашу JavaScript-библиотеку, а когда письмо готово - экспортировать полученный HTML-код письма.
Используйте web-types в WebStorm или PhpStorm для использования подсказок и автозавершения TJML тегов и атрибутов. Или воспользуйтесь start pack для быстрого погружения.
Вставьте следующий JavaScript код сразу после тега <body> :
<script type="text/javascript">
var s=document.createElement("script"),l=document.createElement("link"),d=new Date;s.setAttribute("src","https://ampier.io/tjml/app.js?ver="+d.getTime()),l.setAttribute("type","text/css"),l.setAttribute("rel","stylesheet"),l.setAttribute("href","https://ampier.io/tjml/app.css?ver="+d.getTime()),document.head.appendChild(l),document.body.appendChild(s);
</script>Следует придерживаться следующей структуры:
<div id="app">
<tj-ui>
<m-body>
<!-- some TJML code -->
</m-body>
</tj-ui>
</div>Можно вставить любой TJML или HTML код между <m-body> и </m-body>. Помните, что не любой HTML корректно будет работать в AMP версии письма.
Детальную информацию и тегах (компонентах) и атрибутах вы можете найти в этой документации.