19 просмотров

Редактирование исходного файла html-письма

Редактирование исходного файла html-письма

Нас очень часто спрашивают о возможностях редактирования html-писем. Как правило, проблем с этим не возникает, так как сервисы рассылок оснащены различными редакторами писем.

Но что делать, если вам нужно отправлять письма всего нескольким адресатам и каждое из них должно быть индивидуальным? Платить деньги только за возможность воспользоваться редактором сервиса?

Необязательно. Сегодня мы расскажем вам как заменить контент письма в исходном коде на примере текстового редактора Sublime Text.

Перво-наперво, проверяем, что наше письмо содержит целиком прописанные ссылки на свои изображения. И что картинки расположены не на локальном диске компьютера, а на внешнем сервере. Иначе, Gmail изображения попросту не увидит, и отображаться в письме они не будут.

Итак, логинимся на Gmail, заходим в свою почту и жмём на «Написать» слева вверху

Рис. 1

Раскрывшееся окошко «Новое сообщение» развернём по максимуму, нам далее очень пригодится это пространство

Рис. 2

Теперь решаем задачу вставки html-кода. Просто скопировать/вставить плодов не принесёт, ибо браузер воспримет эту вставку, как просто текст. Поэтому применим военную хитрость и внедрим код нашего письма в код станицы браузера. Итак, правый клик по полю для ввода текста письма. В выпавшем контекстном меню выбираем «Просмотреть код».

Рис. 3

Все примеры действий, которые здесь озвучены, базируются на использовании «родного» для Gmail браузера, Google Chrome. Соответственно, используются и названия окон и команд из него. Но в целом, алгоритм универсален, и по аналогии можно действовать и в других браузерах.

Статья в тему:  Правильно составить письмо просьбу. Образцы деловых писем

Открыв код страницы, браузер Chrome подсветит нам блок кода между тегами

Рис. 4

Отметим, что горизонтальная компоновка окон на этом этапе работы более удобна, и привести окна к такому порядку поможет раскрывающийся список под тремя точками справа вверху вспомогательного окна, как показано на рисунке выше, и в нём надо выбрать средний вариант, «Dock to bottom».

Правый клик по выделенному блоку

Рис. 5

Блок с выделением трансформируется в текстовый блок, пригодный для правки. Выделим всё его содержимое, правый клик по выделенному и выберем «Копировать».

Рис. 6

Теперь нам придётся призвать на помощь текстовый редактор, самый простой — «Блокнот». Делаем с ним два действия. Первое, открываем в нём пустой, чистый без текста файл. И в него копируем содержимое буфера обмена, то, что скопировано нами на предыдущем шаге.

Рис. 7

Им же, «Блокнотом», через контекстное меню и его команду «Открыть с помощью» откроем файл с нашим html-письмом (шаги 2 и 3 на предыдущем рисунке).

Выделяем в «Блокноте» всё содержимое нашего письма и копируем теперь его в буфер обмена.

Рис. 8

Теперь возвращаемся окно «Блокнота» с фрагментом кода из Gmail. Находим и выделяем в конце кода оператор
, и вставляем вместо него содержимое буфера, т.е. код нашего html-сообщения.

Рис. 9

В результате получится модифицированный код страницы браузера из Gmail с внедрённым в него содержимым нашего письма. Но пока он только в «Блокноте», поэтому выделяем всё в этом, только что дополненном нашим кодом, окне и вновь копируем в буфер теперь уже это содержимое.

Статья в тему:  Условное изображение обозначение резьбы. Обозначение резьб

Рис. 10

Возвратимся в Chrome. Там блок кода должен у нас находиться в состоянии редактирования для HTML, как после выполнения команды на рисунке 5. Если видим иное, повторяем то действие, приводим блок кода в состояние для редактирования и выделяем его, полностью и весь. По выделенному — правый клик и «Вставить».

Рис. 11

Завершаем операцию кликом по полю для ввода текста письма — и изменения сохранятся.

Рис. 12

Для выхода из режима правки html-кода закроем окна, отражающие этот код.

Рис. 13

Как полагается, заполняем поля адреса получателя, тему письма. Наше html-письмо, созданное в недрах Gmail и Chrome-а готово, можно смело отправлять.

Рис. 14

И под занавес обзора несколько обыденных, но от этого не менее жизненных советов. Первое, не бойтесь экспериментов, всё, что мы тут наредактировали, произошло только на нашей локальной машине, и простое обновление страницы восстановит исходный код. Второй совет банален, но так же важен и вписывается в парадигму хорошего тона, как и указание темы электронного письма: отправьте созданное сначала самому себе, а вдруг незаметная ошибка исказила ваш шаблон? Лучше, если эту неприятность первым увидите вы, а не ваш адресат. Ну и наконец, помните, что созданное вами можно сохранить в виде черновика. Тогда к результату редактирования можно возвращаться вновь и вновь, по мере надобности.

Статья в тему:  Что запрещено ввозить в израиль список. Что можно ввозить в Израиль и что можно оттуда вывозить, и в каких количествах? Наказания за контрабанду

Подстраховка: сохраняем код в SmartResponder

Раз уж мы «выудили» код из нашего письма, созданного в новом редакторе, раз уж он у нас есть, то можно его сохранить в сервисе SmartResponder для подстраховки. Зачем? Чтобы на его основе создавать новые письма, изменять их, и, что самое важное, использовать на других ресурсах (напомню, что в новом редакторе таких возможностей просто нет).

Для этого код, скопированный из браузера Google Chrome, надо вставить в старый конструктор SmartResponder.

Делается это несложно.

  1. Выбираем во вкладке «Рассылки» раздел «Список шаблонов писем».
  2. Нажимаем на кнопку «Создать шаблон».
  3. Выбираем тип «Красочное HTML-письмо (старый редактор)» и жмём «Дальше».
  4. В открывшемся редакторе в меню инструментов для создания письма нажимаем на кнопку «HTML-код».
  5. Вставляем наш код (жмём Ctrl + V). Можем ещё раз нажать на кнопку «HTML-код», то есть выключить режим отображения кода и включить режим просмотра внешнего вида письма.
  6. Обязательно заполняем поле «Тема письма» (по-русски: даём название нашему шаблону).
  7. Нажимам кнопку «Сохранить».

Вот, собственно, всё, что я хотел рассказать Вам о новом редакторе SmartResponder после того, как создал в нём своё первое письмо.

Хочу сказать, что я ранее вообще не был знаком с сервисом SmartResponder. То есть навыков работы ни в старом, ни в новом редакторе я прежде не имел. Но вот зарегистрировался и разобрался. Что ж, теперь и Вы знаете, как работать в новом конструкторе SmartResponder.

Статья в тему:  Верстка адаптивных писем: памятка маркетолога. Адаптивные email'ы

А какие сервисы для создания и отправки писем используете Вы в своей работе?

С уважением,
Сергей Петров,
автор проекта «Текст-Центр» — студии по созданию продающих текстов, мини-книг, вебинаров, воронок продаж.

Заключение

Мы рассмотрели лишь некоторые из существующих сервисов и приложений, однако при углубленном поиске в сети можно найти множество альтернативных вариантов. При этом стоит помнить о возможности создания шаблонов напрямую из специальных текстовых редакторов при должном знании языков разметки. Такой подход является наиболее гибким и не требует финансовых вложений.

Помимо этой статьи, на сайте еще 12429 инструкций.
Добавьте сайт Lumpics.ru в закладки (CTRL+D) и мы точно еще пригодимся вам.

Отблагодарите автора, поделитесь статьей в социальных сетях.

голоса
Рейтинг статьи
Ссылка на основную публикацию
Статьи c упоминанием слов: