Отправка html-письма при помощи web-интерфейса Gmail
В отличие от специализированных программ-почтовиков, создание html-сообщения электронной почты в веб-интерфейсах распространённых почтовых сервисов, задача, мягко говоря, не тривиальная. Но ознакомится с тем, как это действует, есть резон. Просто уже потому, что этот инструмент всегда есть под рукой. Т.е., ничего не надо скачивать, устанавливать — зашел на соответствующий сервис в браузере, и, что называется — бери и пользуйся.
Эту серию обзоров начнём с Гугловского Gmail-а. Как и для двух других самых распространённых, но уже отечественных сервисов, Mail.ru и Yandex-почта, он не отличается дружелюбностью интерфейсов для создания html-писем, ни в лучшую, ни в худшую стороны. Неудобно, но возможно — самое подходящее определение.
Видео
1 этап — ревизируем шаблон нашего html-письма
Перво-наперво, проверяем, что наше письмо содержит целиком прописанные ссылки на свои изображения. И что картинки расположены не на локальном диске компьютера, а на внешнем сервере. Иначе, Gmail изображения попросту не увидит, и отображаться в письме они не будут.
2 этап — создаём письмо из своего html-шаблона в среде браузера
Итак, логинимся на Gmail, заходим в свою почту и жмём на «Написать» слева вверху
Раскрывшееся окошко «Новое сообщение» развернём по максимуму, нам далее очень пригодится это пространство
Теперь решаем задачу вставки html-кода. Просто скопировать/вставить плодов не принесёт, ибо браузер воспримет эту вставку, как просто текст. Поэтому применим военную хитрость и внедрим код нашего письма в код станицы браузера. Итак, правый клик по полю для ввода текста письма. В выпавшем контекстном меню выбираем «Просмотреть код».
Все примеры действий, которые здесь озвучены, базируются на использовании «родного» для Gmail браузера, Google Chrome. Соответственно, используются и названия окон и команд из него. Но в целом, алгоритм универсален, и по аналогии можно действовать и в других браузерах.
Открыв код страницы, браузер Chrome подсветит нам блок кода между тегами и . Именно это содержимое определяет отображение html-страницы в теле письма.
Отметим, что горизонтальная компоновка окон на этом этапе работы более удобна, и привести окна к такому порядку поможет раскрывающийся список под тремя точками справа вверху вспомогательного окна, как показано на рисунке выше, и в нём надо выбрать средний вариант, «Dock to bottom».
Правый клик по выделенному блоку … вызовет контекстное меню, в нём выбираем команду «Edit as HTML» — редактировать, как HTML.
Блок с выделением трансформируется в текстовый блок, пригодный для правки. Выделим всё его содержимое, правый клик по выделенному и выберем «Копировать».
Теперь нам придётся призвать на помощь текстовый редактор, самый простой — «Блокнот». Делаем с ним два действия. Первое, открываем в нём пустой, чистый без текста файл. И в него копируем содержимое буфера обмена, то, что скопировано нами на предыдущем шаге.
Им же, «Блокнотом», через контекстное меню и его команду «Открыть с помощью» откроем файл с нашим html-письмом (шаги 2 и 3 на предыдущем рисунке).
Выделяем в «Блокноте» всё содержимое нашего письма и копируем теперь его в буфер обмена.
Теперь возвращаемся окно «Блокнота» с фрагментом кода из Gmail. Находим и выделяем в конце кода оператор
, и вставляем вместо него содержимое буфера, т.е. код нашего html-сообщения.
В результате получится модифицированный код страницы браузера из Gmail с внедрённым в него содержимым нашего письма. Но пока он только в «Блокноте», поэтому выделяем всё в этом, только что дополненном нашим кодом, окне и вновь копируем в буфер теперь уже это содержимое.
Возвратимся в Chrome. Там блок кода должен у нас находиться в состоянии редактирования для HTML, как после выполнения команды на рисунке 5. Если видим иное, повторяем то действие, приводим блок кода в состояние для редактирования и выделяем его, полностью и весь. По выделенному — правый клик и «Вставить».
Завершаем операцию кликом по полю для ввода текста письма — и изменения сохранятся.
Для выхода из режима правки html-кода закроем окна, отражающие этот код.
Как полагается, заполняем поля адреса получателя, тему письма. Наше html-письмо, созданное в недрах Gmail и Chrome-а готово, можно смело отправлять.
И под занавес обзора несколько обыденных, но от этого не менее жизненных советов. Первое, не бойтесь экспериментов, всё, что мы тут наредактировали, произошло только на нашей локальной машине, и простое обновление страницы восстановит исходный код. Второй совет банален, но так же важен и вписывается в парадигму хорошего тона, как и указание темы электронного письма: отправьте созданное сначала самому себе, а вдруг незаметная ошибка исказила ваш шаблон? Лучше, если эту неприятность первым увидите вы, а не ваш адресат. Ну и наконец, помните, что созданное вами можно сохранить в виде черновика. Тогда к результату редактирования можно возвращаться вновь и вновь, по мере надобности.
Как отправить HTML письмо из mail.ru, yandex.ru, gmail.com
Для того, чтобы отправить письмо из почты Mail.ru, Yandex.ru, Gmail.com есть один хитрый способ. Мы рассмотрим его на примере браузера Google Chrome.
Откройте в браузере интерфейс нужной Вам почты и нажмите на поле ввода текста письма правую клавишу мыши. Выберите пункт меню «Просмотреть код» и найдите в появившемся окне с HTML кодом страницы почты элемент, в который можно вставить код Вашей верстки.
Далее на этом элементе нажмите правую клавишу мыши и выберите пункт меню «Edit as HTML». В появившийся блок вставьте Вашу верстку и нажмите Ctrl+Enter.
Теперь текст можно редактировать прямо в окне Вашей почты. И остается только нажать отправить.
Как отправить HTML письмо?
Есть сверстанное письмо, которое нужно отправить по определенным адресам, но что-то вообще нет информации про то, как это сделать.
В гмайл искал как это сделать, но не нашел.
- Вопрос задан более трёх лет назад
- 125945 просмотров
Комментировать
Решения вопроса 0
Ответы на вопрос 14
На примере Google Chrome
1) Нажмите [правый клик]>[Просмотр кода элемента] или F12
2) В открывшемся инструменте разработчика в коде текущей страницы (gmail) найдите куда вставить код письма и нажмите [правый клик]>[Edit as HTML]
3) Вставьте Ваш HTML код и нажмите Ctrl+Enter
Ответ написан более трёх лет назад
Нравится 20 3 комментария
из всех способов самый быстрый для гмеил, а то запарно было тестовую рассылку на меилчимп делать! спасибо
Спасибо человек ! 🙂 Я ради этого маил клиент ставил специально — а теперь ничего ставить не надо . Спасибо.
есть еще сервис sendhtmail.ru отправляешь письмо себе, а потом из привычного интерфейса перенаправляешь куда надо.
Ответ написан более трёх лет назад
Нравится 14 1 комментарий
а также крутой сервис по конвертации картинок в base64 https://www.base64-image.de/ чтобы вставлять их в штмл
web-developer
Можно через php. $headers = «Content-type: text/html; charset=utf-8\r\n»; вот такой заголовок для письма использую. Функция mail(«кому отправить», «Тема отправки», «Текст отправки включая теги», $headers); Опять же при этом должен быть под рукой сервак с php.
UPD. Вижу что даже спустя больше 3х лет вопрос таки актуален. Есть putsmail.com сервис для теста писем.
Ответ написан более трёх лет назад
Нравится 7 3 комментария
Ну это понятно что можно отправить так через PHP, но тут ему надо отправлять html страницы через gmail, yandex или Microsoft Outlook
Алексей Кос: понятно. Была такая же задача, но ни к чему не пришел. Нету у gmail и прочих такого по-моему.
Как добавить html подпись в почтовом сервисе Gmail
Для того чтобы установить html-подпись в почтовом сервисе Gmail, перейдите в настройки (иконка в правом верхнем углу) и на вкладке «Общие» найдите пункт «Подпись».
Выберите из списка e-mail адрес, для которого вы хотите использовать подпись и скопируйте содержимое блока визуальной разметки в поле ввода подписи. Сохраните изменения.
Если с установкой подписи возникают проблемы, ознакомьтесь с разделом «Возможные проблемы».