Как сделать ссылку для почты
Как в письме дать ссылку для отправки email на мой адрес (mailto:)?
Как не спамить и выполнять КPI. Какие инструменты маркетинга лучше, а какие хуже. Как отправлять красивые и понятные письма.
что такое mailto:
Когда клиент кликает на ссылку с mailto:, открывается уже заполненное письмо. В нём можно заранее настроить тему, адрес получателя и текст.
Дать ссылку можно двумя способами: ссылкой и кнопкой. Расскажу о каждом.
Поставить ссылку
В блочном и HTML-редакторе UniSender.
1. Открываем письмо в редакторе.
2. Выделяем текст, который хотим сделать ссылкой.
3. На панели инструментов находим кнопку «Вставить / Редактировать ссылку» или нажимаем Ctrl+L.
4. Открывается новое окно. Выбираем тип ссылки — «Email». Ниже вводим адрес, на который будем отправлять письмо. Кроме адреса можно ввести тему и текст сообщения.
Нажимаем OK. Теперь, если клиенты щёлкнут по ссылке, у них откроется автоматически предзаполненное письмо.
Если верстаете вручную. Вставляем в HTML-код ссылку с такими параметрами:
ссылка для mailto
где mailto:order@mysite.com — адрес получателя,
subject — тема письма,
body — текст письма,
%20 — спецсимвол для вставки пробела,
%0A — спецсимвол для переноса строки.
При клике на ссылку из примера у клиента откроется такое письмо:
Поставить кнопку
В блочном редакторе UniSender.
1. Добавляем блок «Кнопка».
2. Заходим в настройки блока.
3. На вкладке «Стиль» настраиваем цвет кнопки, цвет фона и шрифт.
4. Переходим на вкладку «Параметры». Здесь выбираем тип ссылки «Email», а в поле рядом вставляем ссылку:
ссылка для mailto
где order@mysite.com — почта получателя,
subject — тема письма,
body — текст письма,
%20 спецсимвол для вставки пробела,
%0A спецсимвол для переноса строки.
В поле «Текст» пишем текст кнопки.
Готово. Если клиент щелкнет по кнопке, у него откроется заботливо предзаполненное письмо.
Создание и изменение гиперссылок — Office
Помимо веб-страниц, можно создавать ссылки на существующие или новые файлы на компьютере, адреса электронной почты, а также определенные места в документе. Кроме того, вы можете изменить адрес, отображаемый текст и начертание или цвет шрифта гиперссылки.
Если вы хотите удалить ссылки и отключить автоматическое добавление гиперссылок в Office, см. статью Удаление и отключение гиперссылок.
Эта статья относится к классическим версиям Word, Excel, Outlook и PowerPoint. Упрощенный набор функций гиперссылки предлагается в Office Online. Если у вас есть настольная версия Office, вы можете отредактировать документ в ней для получения дополнительных функций работы с гиперссылкой или попробовать или купить последнюю версию Office.
Выделите текст или рисунок, который должен представлять гиперссылку.
Можно также щелкнуть текст или рисунок правой кнопкой мыши и в shortcut-меню щелкнуть ссылку.
В окне Вставка гиперссылки введите или вставьте ссылку в поле Адрес.
Примечание: Если вы не видите поле Адрес, убедитесь, что в разделе Связать с выбрано файлом, веб-страницей.
Вы также можете ввести другой текст для ссылки в поле Текст.
Примечание: Если вы не знаете адрес гиперссылки, нажмите кнопку Интернет 
и скопируйте URL-адрес страницы.
Необязательно. Чтобы изменить подсказку, которая появляется при наведении указателя на гиперссылку, нажмите кнопку Подсказка в правом верхнем углу диалогового окна Вставка гиперссылки и введите текст.
Вы можете добавить гиперссылку на существующий файл или на файл, который вы хотите создать.
Выделите текст или рисунок, который должен представлять гиперссылку.
В разделе Связать с выполните одно из указанных ниже действий.
Чтобы связать ссылку с существующим файлом, в разделе Связать с нажмите кнопку файлом, веб-страницей, а затем найдите нужный файл в раскрывающемся списке Искать в или списке Текущая папка.
Чтобы создать новый файл и добавить ссылку на него, в разделе Связать с выберите Новый документ, введите имя нового файла в поле и используйте указанный путь или перейдите к другой папке, нажав кнопку Изменить. Вы также можете внести правку в новый документ позже или сейчас.
Необязательно. Чтобы изменить подсказку, которая появляется при наведении указателя на гиперссылку, нажмите кнопку Подсказка в правом верхнем углу диалогового окна Вставка гиперссылки и введите текст.
Выделите текст или рисунок, который должен представлять гиперссылку.
Можно также щелкнуть текст или рисунок правой кнопкой мыши и в shortcut-меню щелкнуть ссылку.
В разделе Связать с щелкните элемент электронной почтой.
Введите нужный адрес электронной почты в поле Адрес эл. почты или выберите его из списка Недавно использовавшиеся адреса электронной почты.
В поле Тема введите тему сообщения.
Примечание: Некоторые веб-браузеры и почтовые программы не распознают строку темы.
Необязательно. Чтобы изменить подсказку, которая появляется при наведении указателя на гиперссылку, нажмите кнопку Подсказка в правом верхнем углу диалогового окна Вставка гиперссылки и введите текст.
Можно также создать ссылку на пустое сообщение электронной почты, просто введя адрес в документе. Например, введите proverka@example.com, и гиперссылка будет создана автоматически (если автоматическое форматирование гиперссылок не отключено).
Вы можете создавать гиперссылки для перехода в документ Word или письмо Outlook, которое содержит стили заголовков или закладки. Также можно добавлять ссылки на слайды и произвольные показы в презентациях PowerPoint и отдельные ячейки и листы Excel.
Чтобы добавить стиль заголовка, выделите его текст, откройте вкладку Главная в Word или Формат текста в Outlook и выберите нужный вариант в группе Стили.
Создание гиперссылки на другое место в текущем документе
Выделите текст или рисунок, который должен представлять гиперссылку.
Можно также щелкнуть текст или рисунок правой кнопкой мыши и в shortcut-меню щелкнуть ссылку.
В разделе Связать с выберите параметр Место в документе.
В списке выберите заголовок (только текущий документ), закладку, слайд, настраиваемый показ или ссылку на ячейку, на которую вы хотите со ссылкой.
Необязательно. Чтобы изменить подсказку, которая появляется при наведении указателя на гиперссылку, нажмите кнопку Подсказка в правом верхнем углу диалогового окна Вставка гиперссылки и введите текст.
Создание гиперссылки на место в другом документе
Выделите текст или рисунок, который должен представлять гиперссылку.
Можно также щелкнуть текст или рисунок правой кнопкой мыши и в shortcut-меню щелкнуть ссылку.
В группе Связать с щелкните элемент файлом, веб- страницей.
В поле Искать в щелкните стрелку вниз, а затем найдите и выберите файл, на который должна указывать ссылка.
Щелкните Ссылка, выберите заголовок, закладку, слайд, произвольный показ или ссылку на ячейку, а затем нажмите кнопку ОК.
Необязательно. Чтобы изменить подсказку, которая появляется при наведении указателя на гиперссылку, нажмите кнопку Подсказка в правом верхнем углу диалогового окна Вставка гиперссылки и введите текст.
Чтобы изменить адрес или отображаемый текст добавленной гиперссылки, щелкните ее правой кнопкой мыши и выберите Изменить гиперссылку.
Чтобы изменить внешний вид гиперссылки, например начертание, размер или цвет шрифта, щелкните ее правой кнопкой мыши и выберите Шрифт в контекстном меню или щелкните вариант стиля на появившейся мини-панели инструментов.
Чтобы изменить подсказку, которая появляется при наведении указателя на гиперссылку, щелкните ссылку правой кнопкой мыши, выберите Изменить гиперссылку, нажмите кнопку Подсказка в правом верхнем углу диалогового окна и введите текст.
Создание и удаление гиперссылки в сообщении в Outlook для Mac
В текст сообщения электронной почты можно добавить ссылку, которая будет отображаться в виде соответствующего полного URL-адреса или заданного вами текста.
В тексте сообщения поместите курсор туда, куда вы хотите добавить ссылку.
На вкладке Сообщение нажмите кнопку Гиперссылка.
В поле ссылка выберите веб-страница или файл, этот документ или адрес электронной почты: 
Для веб-страницы или файла: добавьте полный URL-адрес. Для этого документа: выберите место в документе, выбрав его в верхней части документа, заголовков или закладках.
Адрес электронной почты: добавьте адрес электронной почты и тему.
В текстовом поле введите текст, который должен отображаться в сообщении.
Если ссылка должна отображаться как полный URL-адрес, оставьте поле Текст пустым.
Примечание: Чтобы вставить ссылку из буфера обмена в текст сообщения, в меню Изменить выберите команду Вставить. Тем не менее, если вставить ссылку в сообщение таким образом, вы не сможете изменить текст ссылки. Текстом ссылки будет адрес, на который она указывает.
Преобразование текста в гиперссылку
Выделите в сообщении текст, который вы хотите преобразовать в гиперссылку.
На вкладке Сообщение нажмите кнопку Гиперссылка.
В поле Ссылка введите соответствующий адрес.
В сообщении наведите курсор на текст ссылки.
На вкладке сообщение щелкните значок гиперссылки и выберите команду Удалить ссылку.
Ссылки в ваших сообщениях могут отображаться в виде полных URL-адресов или любого выбранного вами текста.
Выполните одно из указанных ниже действий.
Поместите курсор в то место в тексте сообщения, где вы хотите добавить ссылку.
На вкладке Сообщение нажмите кнопку Гиперссылка.
В поле Ссылка введите соответствующий адрес.
В поле Текст введите текст, который должен отображаться в сообщении.
Если ссылка должна отображаться как полный URL-адрес, оставьте поле Текст пустым.
Гиперссылки можно вставлять только в сообщения в формате HTML.
Чтобы вставить ссылку из буфера обмена в текст сообщения, в меню Изменить выберите команду Вставить. Но если вставить ссылку в сообщение таким способом, вы не сможете изменить ее текст. Текстом ссылки будет адрес, на который она указывает.
Преобразование текста в гиперссылку
Выделите в сообщении текст, который вы хотите превратить в гиперссылку.
На вкладке Сообщение нажмите кнопку Гиперссылка.
В поле Ссылка введите соответствующий адрес.
В сообщении наведите курсор на текст ссылки.
На вкладке Сообщение щелкните стрелку рядом с полем Гиперссылка и нажмите Удалить.
Узнайте, как сделать картинку ссылкой в письме Gmail
Большинству пользователей известен тот факт, что наличие гиперссылки в электронном письме способствует перенаправлению адресата непосредственно на целевую интернет-страницу или на скачивание определенного файла. Но, не многие из них знают ещё и о том, как сделать картинку ссылкой в своём письме.
Именно для таких пользователей мы, в этой инструкции, продемонстрируем пошаговый процесс объединения изображения и гиперссылки. В качестве примера, будем использовать аккаунт в бесплатной почтовой службе Gmail от Google.
По числу уникальных пользователей она стала самой популярной в мире. Предоставляет для бесплатного использования свой инструментарий в интуитивно-понятном веб-интерфейсе. Работает на всех операционных системах для ПК, а также мобильных ОС при наличии веб-браузера.
Предполагаем, что вы уже имеете учетную запись в Gmail. Если нет, советуем её получить путем простой регистрации.
Когда будете готовы, войдите в свою почту. Вы увидите простой интерфейс управления электронными сообщениями. С ним и будем работать.
КАК СДЕЛАТЬ КАРТИНКУ ССЫЛКОЙ
Нажмите на кнопку «Написать» слева вверху. Автоматически откроется окно создания письма. Необходимый минимум информации для заполнения следующий:
В нужном вам месте установите курсор и нажмите на иконку «Добавить фото», которая размещена на компактной нижней Панели инструментов. В следующем окне выберите источник получения изображения (Google Фото, Загрузка с диска, Из интернета) и найдите нужное. Перед загрузкой убедитесь в том, что в нижнем правом углу установлена опция «Вставить», а не «Как прикрепленный файл». Если выберите последнюю, то она не поможет нам достигнуть поставленной цели.
Когда изображение появится в теле письма, отрегулируйте его размер. Не бойтесь ничего испортить, у вас будет возможность выбрать, помимо ручного масштабирования, такие размеры по умолчанию, как:
Теперь настало время вставить гиперссылку. Кликните по изображению, чтобы выбрать его. Далее нажмите сочетание клавиш Ctrl + K на клавиатуре или иконку «Вставить ссылку». На первый взгляд, ничего не произойдет, но, если вы повторно нажмете на картинку, то увидите уже другие инструменты для работы. Нажмите на появившуюся ссылку «Изменить».
Откроется окно для изменения параметров. Вам станут доступными поля для ввода отображаемого текста, целевого веб-адреса (URL) или электронной почты. Заполните их. Также сможете проверить ссылку на работоспособность. Нажмите на кнопку «ОК», когда закончите.
Не спешите отправлять сообщение адресату. Сначала убедитесь в правильности введенных данных. Выберите изображение еще раз и если гиперссылка вставлена правильно, появится возможность перехода по соответствующему url-адресу.
Вот и всё, сегодня будем считать вопрос, как сделать картинку ссылкой, решенным. Спасибо за внимание!
Как отправить HTML-письмо: 4 простых способа
Как не спамить и выполнять КPI. Какие инструменты маркетинга лучше, а какие хуже. Как отправлять красивые и понятные письма.
Все email-письма можно разделить на два вида: Plain Text и HTML. Первые вы видели и писали много раз — это обычное текстовое сообщение, в котором можно выбрать шрифт или вставить гиперссылки. HTML-письма часто отправляют бренды: в них много картинок, есть кнопки, макет часто разделен на несколько колонок.
Кажется, что для создания HTML-писем нужно быть верстальщиком 80-го уровня. Но это не так: создать красивое письмо можно совсем без знаний в дизайне и верстке.
Я расскажу, как подготовить шаблон email и отправить его — через сервис рассылок или обычную почту.
Как создать HTML-письмо
Задизайнить и сверстать письмо можно четырьмя способами.
В блочном редакторе
Блочный редактор помогает верстать email тем, кто в совершенстве не владеет HTML и CSS. Письмо составляется по принципу конструктора Lego — из смысловых блоков разных размеров, которые вы заполняете контентом. Шаблон настраивается под конкретный проект в блочном редакторе: иногда можно обойтись только заменой картинок и текста.
| Плюсы HTML-верстки в блочном редакторе | Минусы HTML-верстки в блочном редакторе |
| + не требует знаний HTML и CSS |
+ большой выбор редакторов
+ в каждом редакторе доступна база готовых шаблонов, на основе которых можно сверстать свое письмо
— при создании писем вы ограничены элементами и структурой, которые доступны в редакторе
Как создать HTML-письмо в блочном редакторе
Создавать письмо удобнее сразу в сервисе рассылки, которым вы пользуетесь: сверстали письмо, отправили его и потом анализируете статистику. К тому же, не придется подгонять шаблон под требования сервиса. Для примера я взял встроенный блочный редактор UniSender.
Предлагаю создать HTML-письмо на основе готового шаблона в редакторе UniSender:
2. Перед тем, как запустить рассылку, загрузите базу подписчиков — список email-адресов, на которые вы будете слать письма.
3. Начните создавать email-рассылку в сервисе : пропишите адрес, с которого будете отправлять письмо, имя отправителя и тему письма. Чтобы создать письмо, заходите в «Рассылки» → «Email».
4. Выберите пункт «Блочный редактор». Вы также можете сверстать письмо на основе шаблонов писем, выбрав пункт «Шаблоны».
5. Выберите «Заполненный шаблон» — так будет легче сверстать письмо. В этот шаблон можно подставить любой текст, картинки или кнопку. Для этого перетаскивайте нужный блок из левой панели в макет письма, а затем кастомизируйте его.
6. Сохраните шаблон и нажмите «Продолжить». В открывшемся окне можно будет отредактировать шаблон или изменить параметры рассылки. Также сервис покажет вес письма (чем меньше, тем лучше), и предложит отправить пробное.
7. Отправьте письмо через сервис рассылок. Выберите базу контактов, которую вы загрузили в самом начале. Вы также можете нажать «Сохранить как шаблон», и отправлять рассылки на основе созданного шаблона: с вашим логотипом, ссылками и цветами.
В визуальном редакторе
В блочном редакторе вы собираете письмо из отдельных блоков и в отдельном окне можете посмотреть HTML-код всего письма. В визуальном редакторе вы напрямую работаете с кодом и сразу видите, как меняется шаблон письма. Например, в визуальном редакторе Mailigen рабочее поле делится на две колонки: в левой работают с кодом, в правой – сразу показываются изменения в шаблоне.
| Плюсы HTML-верстки в визуальном редакторе | Минусы HTML-верстки в визуальном редакторе |
| + если неправильно поставили тег, это сразу будет видно в окне просмотра |
+ в большинство блочных редакторов уже встроены визуальные редакторы. Между ними можно переключаться
— малый выбор визуальных редакторов: большинство идут в связке с блочным
В редакторе первичного кода
В редакторах типа Sublime Text 3 и Visual Studio Code вы вручную прописываете HTML-код, который потом загружаете в сервис email-рассылок или почтовое приложение. Смотреть, как выглядит письмо, приходится в отдельной вкладке браузера, куда вы заливаете HTML-код.
| Плюсы HTML-верстки в редакторе первичного кода | Минусы HTML-верстки в редакторе первичного кода |
| + нет ограничений по структуре и формату письма |
+ доступны встроенные инструменты для упрощения работы над кодом
+ можно скопировать HTML-код любого письма и создать на его основе собственное
— нельзя сразу в редакторе первичного кода посмотреть, как будет выглядеть письмо на мобильных или ПК
Заказать на аутсорсе
HTML-письмо сверстает фрилансер, сервис email-рассылок или веб-студия. Вы получите адаптивный шаблон, который будет отвечать брендбуку компании. Это может быть универсальное письмо, email под конкретную акцию или welcome-серия.
Заказать верстку письма можно:
| Плюсы верстки на аутсорсе | Минусы верстки на аутсорсе |
| + не тратите время на верстку письма |
+ несложно найти исполнителя — в сервисе, через который вы делаете рассылку, будет дополнительная услуга «Разработать HTML-письмо»
+ получите готовое письмо через 2-4 дня
— нужно платить за каждый отдельный вариант письма
— мало веб-студий, которые занимаются HTML-письмами
Как отправить HTML-письмо
Когда письмо готово, его нужно отправить. Расскажу, как сделать это через сервис рассылки или вручную через почтовики Gmail, Mail.ru, Yandex и Outlook.
Отправляем через сервис рассылки
Сервис email-рассылок — платформа, в которой вы будете управлять рассылкой. В таких сервисах можно верстать письма, анализировать статистику, настраивать автоматические уведомления об оплате и даже создавать лендинги. Отправить HTML-письмо можно через любой из таких сервисов, поэтому в качестве примера я взял UniSender.
Если верстали во внешнем блочном редакторе
Внешний блочный редактор — это сервис, в котором можно собрать письмо, но нельзя его отправить. Для отправки шаблон нужно переносить в сервис рассылки. Рассказываю, как это сделать за 6 шагов.
1. Экспортируйте HTML-письмо в UniSender. Например, на бесплатном тарифе Stripo доступно 4 экспорта в месяц.
2. Введите имя аккаунта и API key. Ключ API можно найти в профиле UniSender. Он доступен в Личном кабинет по вкладке «Интеграция и API».
3. Переходим в UniSender. Найдите HTML-письмо в меню «Рассылки»/«Мои шаблоны». Оно появится сразу же после экспорта.
4. Проверьте письмо перед запуском. На этом этапе в HTML-редакторе UniSender можно исправить опечатки, изменить форматирование и добавить картинки. Если результат нравится — сохраните изменения.
5. Создайте рассылку в личном кабинете. Адрес отправки, имя отправителя и тему письма можно будет поменять позже, после настройки шаблона.
Если создавали письмо в редакторе первичного кода
Если вы верстали письмо в редакторе первичного кода, его также можно отправить через сервис рассылок. Расскажу на примере Visual Studio Code, что делать, если у вас уже есть HTML-код письма и вы хотите вставить его в сервис рассылки.
Сохраните письмо в формате HTML.
В UniSender создайте новую рассылку и выберите пункт «HTML-редактор».
В открывшемся окне редактора нажмите «Загрузка из файла». Выберите HTML-файл, который вы сохранили ранее в Visual Studio Code, и загрузите его.
Нажмите «Продолжить» и проверьте данные: имя отправителя, адрес отправки, тему письма. На этом этапе также можно вернуться в шаблон письма и отредактировать его: исправить опечатки, добавить изображения, проверить ссылки.
Отправляем вручную в почтовике
Дальше надо просто вставить код письма в почтовик и отправить. Расскажем, как это сделать в разных программах.
В Gmail
Чтобы залить HTML-письмо в Gmail вручную, нужно:
2. Подсвеченный синим блок — это код поля для текста письма. Кликните по нему правой кнопкой мыши и выберите «Редактировать как HTML».
3. Удалите фрагмент
и вставьте вместо него HTML-код письма. Как только закроете окно консоли, письмо отобразится в поле текста Gmail.
4. Добавьте получателя и введите тему письма.
5. Отправьте тестовое письмо, чтобы проверить его на ошибки. Например, если вы забудете проставить ссылки на изображение в HTML-шаблоне, при просмотре в Gmail в углу картинки появится кнопка «Скачать».
6. Если с тестовым письмом все ок, отправляем боевую рассылку.
В Mail.ru
Чтобы залить HTML-письмо в Mail.ru вручную, нужно:
2. Подсвеченная синим строчка — это код поля для текста письма. Кликните по нему правой кнопкой мыши и выберите «Редактировать как HTML».
3. Удалите фрагмент
и вставьте вместо него HTML-код письма. Как только закроете окно консоли, письмо отобразится в поле текста Mail.ru.
4. Добавьте получателя и введите тему письма.
5. Отправьте тестовое письмо, чтобы проверить его на ошибки.
6. Если с тестовым письмом все ок, отправляем боевую рассылку.
В Yandex
Чтобы залить HTML-письмо в «Яндекс.Почту» вручную, нужно:
1. Включите панель оформления. По умолчанию в интерфейсе «Яндекс. Почты» эта панель отключена, а значит вы не сможете вставить HTML-код.
3. Подсвеченная синим строчка — это код поля для текста письма. Кликните по нему правой кнопкой мыши и выберите «Редактировать как HTML».
4. Удалите фрагмент
и вставьте вместо него HTML-код письма. Как только закроете окно консоли, письмо отобразится в поле текста Yandex.
5. Отредактируйте HTML-шаблон. В нём может слететь форматирование: появиться лишние отступы или пустые строчки.
6. Добавьте получателя и введите тему письма.
7. Отправьте тестовое письмо, чтобы проверить его на ошибки. Если с тестовым письмом все ок, отправляем боевую рассылку.
В Outlook
Чтобы залить HTML-письмо в Outlook вручную, нужно:
2. Подсвеченный синим блок — код поля для текста письма. Кликните по нему правой кнопкой мыши и выберите «Редактировать как HTML».
3. Удалите фрагмент
и вставьте вместо него HTML-код письма. Как только закроете окно консоли, письмо отобразится в поле текста Outlook.
4. Проверьте шаблон: все ли картинки отображаются, не слетело ли оформление.
5. Добавьте получателя и введите тему письма.
6. Отправьте тестовое письмо, чтобы проверить его на ошибки. Если с тестовым письмом все ок, отправляем боевую рассылку.
Итого
Если вы никогда раньше не создавали HTML-письмо, лучше заказать его специалисту. Хочется сверстать самому — начните с изменения готового шаблона в блочном редакторе. Это самый простой способ, с которым можно получить отличный результат.
Удобнее верстать письмо во встроенном редакторе сервиса рассылки или редакторе, у которого интеграция с этим сервисом.
Работа в визуальном редакторе понравится пользователям, которые почитали про HTML-верстку и создали с десяток писем в блочном редакторе.
Большинство редакторов, с которыми вы столкнетесь — комбинация блочного и визуального.
Если привыкли работать в конкретном редакторе — верстайте письмо в нем, сохраняйте отдельным файлом и импортируйте в сервис рассылок.
Отправить HTML-письмо вручную можно в любом почтовике. Удобнее всего это сделать в Gmail, а вот в «Яндекс.почте» придется сначала включить панель оформления. Также в «Яндекс. почте» может слететь верстка или не загрузиться картинки.