04 октября 2022

Как создать HTML-подпись письма

Создать собственную подпись письма

Профессионально составленная HTML подпись письма помогает продвигать личный бренд и бренд компании, собирать слушателей для вебинаров, продавать товары, консультировать, поддерживать фирменный стиль и многое другое. Например, 82% digital-маркетологов используют подписи писем для кампаний по повышению узнаваемости бренда. Чтобы улучшить ваши email-кампании, мы решили собрать специальный гайд по добавлению HTML-подписи к персональным письмам в Gmail, Outlook, Apple Mail и Yahoo, а также научить вас добавлять подписи к рассылкам с помощью Stripo.

Как создать HTML-подпись письма для личной переписки

1. HTML-подпись письма в Gmail

Итак, давайте начнем с добавления подписи HTML-письма в Gmail. Мы пройдем все необходимые шаги, чтобы показать вам простой процесс добавления подписи.

Как создать профессиональную подпись для своего аккаунта Gmail:

  • перейдите к настройкам;

  • затем снова нажмите на «настройки»;

  • внизу страницы вы увидите надпись «Подпись»;

  • вставьте изображение;

  • выберите «маленький» размер;

  • загрузите изображения иконок соцсетей;

  • добавьте ссылки на них;

(Источник: Gmail)

  • в нижней части страницы нажмите «Сохранить Изменения»

  • готово.

Я протестировала свою подпись письма: разослала сообщения в разные почтовые клиенты и открыла их на различных десктопных и мобильных устройствах. Все сработало!

Теперь ваши подписи писем будут креативными и красивыми!

Вы также можете создать подписи для деловой и личной переписки с помощью внешнего конструктора подписей для писем.

2. HTML-подпись письма в Outlook.com

Настало время поговорить о процессе добавления подписи Outlook в ваше письмо.

Как создать профессиональную подпись в аккаунте Outlook:

  • перейдите в «Настройки»;

  • затем выберите «Просмотреть все настройки Outlook»;

(Источник: Outlook)

  • затем перейдите на вкладку «Почта»;

  • откройте вкладку «Составить и ответить»;

  • в новом окне найдите секцию «Электронная подпись»;

  • введите необходимый текст;

  • чтобы добавить соцсети, загрузите их иконки как обычные картинки;

(Источник: Outlook)

  • выделите каждую иконку и вставьте соответствующие ссылки;

(Источник: Outlook)

  • если вы хотите автоматически включать эту подпись в свои письма, обязательно установите оба флажка, как показано ниже;

(Источник: Outlook)

  • выберите «HTML» в качестве формата сообщения, иначе Outlook.com включит только текстовую часть вашей подписи без иконок и ссылок;

  • нажмите «Сохранить».

(Источник: Outlook)

Обратите внимание, что в данном почтовом клиенте можно добавить несколько пользовательских подписей. В таком случае вам нужно будет выбрать подпись при отправке личного письма.

3. HTML-подпись письма в Apple Mail

В почтовом сервисе Apple можно добавлять в подпись только текстовые элементы. И, конечно, вы можете добавить в нее ссылку. Теперь давайте посмотрим, как это делается

Как создать подпись письма в Apple Mail:

  • кликните на Письмо в левом верхнем углу;

  • затем на Настройки;

  • перейдите на вкладку Подпись;

(Источник: Apple Mail)

  • если вы хотите добавить ссылку в подпись своего письма в Apple Mail, выделите необходимый фрагмент текста;

  • кликните по нему правой кнопкой мыши и вставьте свою ссылку.

(Источник: Apple Mail)

Обратите внимание, что в данном почтовом клиенте можно добавить несколько подписей. В этом случае вам нужно будет выбрать подпись при отправке личного письма.

(Источник: Apple Mail)

При необходимости вы также можете отредактировать подпись непосредственно перед отправкой письма.

4. HTML-подпись письма в Yahoo

В настоящее время в почтовом клиенте Yahoo нельзя добавлять фотографии и изображения в подпись письма. Соответственно, не разрешается использовать и иконки социальных сетей.

Однако вы можете добавить ссылку в подпись в Yahoo Mail.

Как создать пользовательскую подпись в Yahoo Mail:

  • кликните по значку меню Настройки;

  • перейдите на вкладку «Создание письма»;

  • переключите кнопку Подпись;

  • введите пользовательский текст подписи;

(Источник: Yahoo)

  • вставьте ссылки.

Вы можете добавить любое количество ссылок в свою пользовательскую подпись письма.

(Источник: письмо от Point)

Кроме того, вы можете отредактировать свою HTML-подпись в любое время.

Генераторы подписей писем

В дополнение к стандартным методам, о которых мы рассказали выше, вы можете использовать генераторы HTML-подписей писем, чтобы быстро создать HTML-подпись для своего письма. В настоящее время на рынке существует довольно много различных популярных инструментов:

  • Rocketseed (Платно);

  • Signature.email (Бесплатно);

  • Hubspot Email Signature Generator (Бесплатно);

  • MailSignatures (Платно);

  • WiseStamp (Платно);

  • MySignature (Платно);

  • New old stamp (Платно);

  • Gimmio (Платно);

  • Designhill (Бесплатно);

  • Signature Maker (Платно);

  • Signatu.re (Платно);

  • Email Signature Rescue (Платно).

Они помогут вам с легкостью создать шаблон подписи письма, который можно будет использовать в дальнейшем на выбранной вами email-платформе.

Как создать подпись письма для рассылок с помощью Stripo

В этом разделе мы покажем, как создавать подписи к письмам, они же футеры, для HTML-рассылок.

Существует три простых способа сделать это с помощью Stripo:

Способ 1. Использование готовых модулей Stripo

Stripo подготовила множество готовых к использованию модулей подписи письма. 

Выберите любой, легко настройте его, и ваша подпись готова.

(Источник: Stripo)

Используйте наши готовые Модули с подписями, чтобы сэкономить время на создание писем
Присоединиться к Stripo

Способ 2. Использование профессиональных шаблонов подписей письма

Для удобства мы создали несколько шаблонов с различными примерами подписей к письмам.

Выберите лучший формат подписи письма из наших шаблонов, чтобы сразу же создать собственную
Просмотреть

Выберите необходимый формат подписи, используйте ее в своих HTML-письмах или просто вдохновитесь примерами для создания новой подписи с нуля.

Способ 3. Создание профессиональной подписи письма с нуля, используя Stripo в качестве генератора подписей

Если ни одна из созданных нами подписей не соответствует вашим требованиям, вы можете создать ее с нуля.

Мы покажем, как создать подпись, подобную приведенной ниже.

(Источник: Stripo)

Чтобы создать такую подпись, вам нужно:

  • перетащить структуру с двумя колонками в свой шаблон;

(Источник: Stripo)

  • перетащить блок Картинка;

  • загрузить свое изображение нужной формы;

  • во второй контейнер добавить блок Картинка для фото вашей рукописной подписи;

  • ниже вставить блок Текст для ввода своего имени. Не забудьте настроить необходимые стили на панели инструментов;

(Источник: Stripo)

  • чтобы добавить номер телефона и название сайта с иконками в шаблон подписи письма, необходимо перетащить блок Меню и задать тип меню «Иконки и ссылки»;

(Источник: Stripo)

  • загрузить свои пользовательские значки;

  • в полях «Пункт» ввести название вашего сайта, номер телефона и т. д.;

(Источник: Stripo)

  • теперь, чтобы добавить ссылки на аккаунты в соцсетях, нужно перетащить блок «Соцсети» в свой шаблон;

  • оформить его в соответствии с вашими потребностями;

  • добавить ссылку на свой социальный профиль;

  • чтобы добавить горизонтальный разделитель, нужно кликнуть по левому контейнеру с фото;

  • включить «Рамку» в боковой панели настроек;

  • установить необходимый стиль границы для «Левой» стороны этого контейнера.

При желании вы можете добавить логотип своей компании.

(Источник: Stripo)

Сохраните готовую подпись для дальнейшего использования

Обязательно сохраните этот Модуль в своей личной библиотеке, чтобы использовать его в будущих кампаниях.

Вам нужно будет просто вставить эту подпись в свой шаблон и слегка отредактировать ее, если это необходимо.

(Источник: Stripo)

В завершение

Как видите, создание подписей писем — довольно простой процесс, и вам не нужно разбираться в каскадных таблицах стилей и обладать техническими знаниями. Тем не менее, добавление подписи письма важно для поддержания узнаваемости бренда, продвижения вашей компании, услуг или вас как личности. Благодаря Stripo создание и добавление подписи еще никогда не было таким простым.

Создайте собственную подпись письма с помощью платформы email-дизайна Stripo
4 комментариев
To see this tutorial, I have just made an Email Signature through stripo. But after pasting the code in Gmail, It informed too long code. Not work finally.
Hi. This article is aimed to show how to create a signature without using code or signature generators. If you need a better solution, we have a dedicated email signature generator with full-fledged guide in using it. https://stripo.email/blog/how-to-design-an-email-signature-with-stripo/
Can I build a nice e-mail signature in Stripo then export the HTML for use in my personal e-mails? Like Apple Mail or Gmail?
Hello, Strops Marketing. Thank you for your question. Yes, you can. We released an email signature generator a few weeks after we'd published this article. The generator is easy to use and has a step-to-step guide. https://stripo.email/signature-generator-tool/ We wish you the best of luck.