бесплатных HTML-шаблонов электронной почты | Диспетчерская
| Стартер | Команды | команд+ | |
| Универсальный стиль | ✓ | ✓ | |
| Конструктор электронной почты с перетаскиванием | ✓ | ✓ | |
| Редактор пользовательского кода | ✓ | ||
| Пользовательские шрифты | ✓ | ||
| Специальные элементы устройства | ✓ | ✓ | |
| История версий | ✓ | ✓ | |
| Настройки ссылки на социальные сети | ✓ | ||
| Комментарии | ✓ | ✓ | |
| Превью в реальном времени | ✓ | ✓ | |
| Предварительный просмотр темного режима | ✓ | ||
| ✓ | ✓ | ✓ | |
| Пользовательские поля слияния | ✓ | ✓ | |
| ✓ | ✓ | ||
| Ограждения, соответствующие требованиям торговой марки и законодательства | ✓ | ✓ | ✓ |
| Разрешения роли пользователя | ✓ | ✓ | |
| Логика ESP | ✓ | ✓ | |
| Код экспорта | ✓ | ✓ | ✓ |
| Поддержка электронной почты AMP | ✓ | ✓ | |
| Процессы утверждения | ✓ | ✓ | |
| Доступ к API | ✓ | ✓ | ✓ |
| Управление пользователями | – | ✓ | |
| Перевод (через Smartling) | – | – | ✓ |
| Экспорт через API | – | ✓ | |
| Локализации | – | – | |
| Менеджер по работе с клиентами | – | – | ✓ |
| Премиум поддержка | – | ✓ | |
| Соглашение об уровне обслуживания | – | – | |
| Премиум SAML SSO | – | – | ✓ |
| Пользовательские темы | – | ✓ | |
| Рабочие места | – | – | ✓ |
| Дизайн / услуги AMP | – | ✓ | |
| Цены | $149/мес | 499 долларов США в месяц | Пользовательский |
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
svg" />"}»> ✓
svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-line.svg" />"}»> –
dyspatch.io/wp-content/themes/dyspatch/images/table-check.svg" />"}»> ✓
svg" />"}»> –
svg" />"}»> ✓
dyspatch.io/wp-content/themes/dyspatch/images/table-line.svg" />"}»> –
dyspatch.io/wp-content/themes/dyspatch/images/table-line.svg" />"}»> –Быстро создавайте электронные письма в формате HTML с помощью служебного CSS
Maizzle — это платформа, помогающая быстро создавать электронные письма в формате HTML с помощью
Tailwind CSS и расширенной постобработки, предназначенной для электронной почты.
Команда
Используйте инструмент @maizzle/cli чтобы быстро создать проект Maizzle и приступить к разработке шаблонов электронной почты.
Код
Кодируйте электронные письма в HTML и оформляйте их с помощью Tailwind CSS. Maizzle позаботится обо всех оптимизациях электронной почты, таких как встраивание CSS.
Настроить
Адаптивный или гибридный? Сначала мобильные или десктопные? Держите все под контролем и кодируйте свои электронные письма так, как вам нравится.
tailwind.config.js module.exports = {
тема: {
экраны: {
см: {макс.: '600px'},
md: {минимум: '768px', максимум: '1023px'},
},
продлевать: {
цвета: {
синий: {
марка: '#286dbd',
},
},
интервал: {
полный: «100%»,
пкс: '1пкс',
0: «0»,
2: «8 пикселей»,
4: «16 пикселей»,
}
}
}
} Усовершенствуйте рабочий процесс разработки электронной почты
Maizzle предоставляет вам современные инструменты веб-разработки, позволяющие быстро создавать прототипы электронной почты, сохраняя при этом всю вашу команду в соответствии с брендом.
Кто сказал, что CSS-фреймворки следует использовать только для веб-сайтов? Maizzle использует CSS-фреймворк Tailwind, так что вы можете быстро создавать прототипы красивых электронных писем в формате HTML. Забудьте о написании встроенных стилей.
Утилита-первый CSS
Tailwind CSS предоставляет низкоуровневые служебные классы, которые помогают создавать электронные письма намного быстрее, чем вручную писать встроенный CSS.
Мощные модификаторы
Используйте мощные классы вариантов, такие как hover:bg-blue-500 или sm:w-full легко
добавьте эффекты наведения или стилизуйте адаптивные электронные письма.
Сделай сам
С легкостью создавайте или вводите собственную систему дизайна электронной почты, сохраняя бренд каждого члена вашей команды.
src/templates/example.html<выравнивание таблицы="центр"> <тд> BYOHTML
Добавьте свой собственный HTML
BYOHTML™
Код с разметкой вы уже знаете.
Принесите свой собственный HTML
Нет необходимости изучать собственный синтаксис или адаптировать к нему свои шаблоны. Используйте свой существующий HTML, если хотите, он просто сработает.
Наддув с помощью PostHTML
PostHTML дает вашему HTML супервозможности, позволяя использовать компоненты и сложную логику с помощью простой, удобной для текстового редактора разметки.
config.production.js module.exports = {
строить: {
шаблоны: {
источник: 'src/templates',
место назначения: {
путь: 'build_production',
расширение: 'html',
},
ресурсы: {
источник: 'src/images',
пункт назначения: «изображения»,
},
},
}
} Строить Окружающая среда
Пользовательские сценарии сборки, легко настраиваемые в JavaScript.
Используете поддельные данные локально, но вам нужно получить контент из API в рабочей среде?
Предварительная разметка электронной почты для ваших коллег? Все возможно.
CLI-команды
Каждая конфигурация среды сборки включает собственную команду сборки CLI, поэтому вы можете создавать одни и те же шаблоны любым удобным для вас способом.
Трансформеры по выбору
Выберите, какие преобразования постобработки Maizzle применяет к вашим электронным письмам в формате HTML на основе среды сборки.
Переопределить из шаблона
Определите или переопределите данные для каждого шаблона непосредственно перед его компиляцией с помощью переменных YAML Front Matter.
Маиззл Особенности
Настраиваемые инструменты, созданные для разработки электронной почты.
Tailwind CSS
Быстро оформляйте сообщения электронной почты в формате HTML с помощью служебных классов CSS. Двигайтесь быстрее, избегая переключения контекста и никогда не выходя из HTML-кода.
Для начинающих
Бесплатные шаблоны электронной почты с открытым исходным кодом, созданные с помощью Maizzle. Просто клонируйте репозиторий и начните создавать электронные письма в формате HTML.
BYOHTML™
Напишите собственную HTML-разметку и стилизуйте ее с помощью Tailwind CSS. Вам не нужно изучать пользовательские теги или атрибуты.
Среды сборки
Различные конфигурации для любого количества сценариев сборки, от локальной разработки до готовых шаблонов электронной почты.
Трансформеры
Оптимизация электронной почты в формате HTML, настраиваемая глобально или для каждого шаблона через Front Matter.
События
Запускайте собственный код JavaScript на ключевых этапах процесса сборки для еще большей настройки и контроля.
Browsersync
Начните локальную разработку и просматривайте предварительный просмотр ваших электронных писем в браузере, который обновляется каждый раз, когда вы вносите изменения.
Настроено на JavaScript
Maizzle настроено на JavaScript, поэтому вы можете даже require() получать пакеты или данные шаблона из API.
Мощные шаблоны
Maizzle использует PostHTML, дополненный пользовательскими плагинами, что дает вам мощные инструменты для создания шаблонов.
Markdown
Вы можете использовать GitHub Flavored Markdown в своих шаблонах. И это полностью настраивается, даже через Front Matter.
Инструмент CLI
Быстро создайте новый проект из любого Maizzle Starter, разработайте локально, а затем создайте свои электронные письма для производства.
API
Требовать Maizzle или его Transformers в вашем приложении, а также компилировать или обрабатывать электронные письма в формате HTML.
Front Matter
Определение пользовательских данных или переопределение любых параметров конфигурации прямо из шаблона с помощью переменных Front Matter.
Встраивание CSS
Автоматическое, настраиваемое, оптимизированное для электронной почты встраивание CSS.
Включено по умолчанию при сборке для производства.
Minify
Минимизация кода, безопасная для электронной почты, которая может помочь уменьшить вес ваших производственных электронных писем в формате HTML и избежать обрезки.
Prettify
Нужно отправить электронное письмо в формате HTML человеку для просмотра? Maizzle умеет красиво печатать разметку, делая ее более читабельной.
Классы Uglify
Перепишите имена классов CSS, чтобы они были как можно короче, чтобы ваши производственные электронные письма стали еще легче!
Совместимость с CDN
Уже используете CDN ? Определите базовый путь или URL-адрес, и Maizzle добавит его к вашим источникам мультимедиа.
Параметры URL
Используйте Front Matter для добавления параметров URL к ссылкам в ваших шаблонах — все они будут добавлены автоматически.
Пользовательские шрифты
Легко загружайте Google Fonts или любые другие пользовательские веб-шрифты, а затем используйте их с помощью служебных классов Tailwind CSS.
Версии с открытым текстом
При необходимости создавайте оптимизированные версии с открытым текстом из электронных писем в формате HTML. Или пусть это сделает ваш ESP . Ваш звонок.
Система сборки
Простая и быстрая система сборки Node.js, которая выполняет все преобразования, необходимые для электронных писем в формате HTML.
Туннелирование локального хоста
Поделитесь настраиваемым URL-адресом проекта Maizzle, над которым вы работаете, с коллегой или клиентом.
⚡4email
Создавайте интерактивные электронные письма AMP с информацией в реальном времени и встроенными действиями. Используйте наш AMP Starter или напишите свой собственный.
Получайте уведомления, когда мы запускаем Mailviews.
Сотни адаптивных HTML-компонентов и шаблонов электронной почты от создателей Maizzle.
Подписываясь, я соглашаюсь с
политика конфиденциальности.
Маиззл Направляющие
Узнайте, как создавать электронные письма в формате HTML с помощью Tailwind CSS в Maizzle.
Посмотреть все руководстваКак создать информационный бюллетень по электронной почте в формате HTML из файлов Markdown
Узнайте, как создавать адаптивные электронные письма в формате HTML из файлов Markdown в Maizzle. Напишите свой информационный бюллетень в файлах .md, импортируйте компоненты и стилизуйте все это с помощью Tailwind CSS.
Как создать шаблон AMP для электронной почты
Используйте AMP для электронной почты в Maizzle, чтобы легко создавать интерактивные электронные письма в формате HTML с информацией в реальном времени и встроенными действиями.
Как создать рассылку по электронной почте из RSS-канала
Узнайте, как использовать Maizzle Events и библиотеки синтаксического анализа RSS для создания информационного бюллетеня по электронной почте из (атомарного) RSS-канала.
Использование WordPress API для создания новостной рассылки из ваших сообщений
Узнайте, как использовать API WordPress и Maizzle для создания новостной рассылки по электронной почте в формате HTML с вашими последними публикациями.
Как использовать фоновые градиенты CSS в электронных письмах HTML
Узнайте, как добавить градиенты фонового изображения CSS с помощью резервного варианта Outlook VML в HTML-шаблоны электронной почты в Maizzle.
Как добавить подсветку синтаксиса PrismJS в электронные письма в формате HTML
Использование PrismJS, изолированных блоков кода Markdown и событий в Maizzle для добавления подсветки синтаксиса в электронные письма в формате HTML.
Maizzle позволяет мне структурировать мой код так, как я хочу, помогая мне автоматизировать такие вещи, как отслеживание ссылок или встраивание стилей. Мне нравится, что я могу легко создать версию для локальной разработки и правильно упаковать ее для доставки клиентам.
Реми Парментье Разработчик электронной почты @ Tilt Studio
Maizzle позволяет нам создавать более качественные и последовательные электронные письма за меньшее время и без какой-либо типичной неприятной «магии черного ящика», которая часто поражает другие фреймворки.
