22 июня 2020
20221
16 мин
5.00
Добавление якорных и гиперссылок в сообщениях eSputnik
Ссылки в письмах, особенно длинных, выполняют сразу несколько важных функций: они ведут клиентов из email-а на нужные страницы, помогают отследить эффективность кампаний в самом письме, а если постараться, то можно добавить их в длинные письма для навигации. Поэтому не забывайте всегда уделять им внимание.
Какие виды ссылок существуют?
Гиперссылки для картинок и кнопок
Гиперссылки, или обычные ссылки, ведут клиентов из письма на страницы сайта или нескольких сайтов, а также на нужные лендинги, изображения и другие медиафайлы и страницы.
Как показывает статистика eSputnik, в проморассылке в среднем содержится около 20 таких ссылок. Каждый пункт меню, изображение, видео, баннер, кнопка СТА, иконка соцсетей – все должно быть подкреплено ссылкой. Это очень помогает в сборе статистики и анализе поведения пользователей.
Например, письмо с распродажей:
Поведение пользователей абсолютно разное: они переходят по ссылкам, которые кажутся им наиболее интересными. Соответственно, чем больше привлекательных элементов в письме, тем больше шанс перевести клиента на сайт. Экспериментируйте с дизайном в письмах: добавляйте яркие кнопки СТА, привлекающие внимание баннеры, GIF-изображения, красивые картинки, видео и т. д.
Гиперссылки для текста в email-сообщении: что это и как добавить?
Очень редко можно встретить письмо, в котором нет текста, хотя бы пары предложений. Изображения могут не отобразиться, а вот почтовик должен понимать, что находится в письме. Прикрепить гиперссылку к тексту в редакторе eSputnik нетрудно. Достаточно выделить ту часть, где должна быть ссылка, нажать на соответствующую иконку
и вставить URL в поле “Ссылка” открывшегося меню:
Чтобы пользователи обращали внимание на ссылки, рекомендуем следовать таким советам:
-
составлять их из двух-трех слов,
-
использовать в начале ключи,
-
давать понять, куда человек попадет после перехода,
-
не делать ссылок с одинаковым текстом и разным адресом.
Выше мы уже рассказывали, куда и для чего добавляются гиперссылки в email-сообщении. Теперь давайте разберемся, как это сделать.
Добавляем гиперссылки в блок с видео
-
добавьте в шаблон структуру с одним контейнером;
-
перетащите в него блок с видео;
-
кликните по нему, чтобы активировать панель настроек;
в соответствующее поле слева вставьте ссылку на свое видео;
-
наш редактор автоматически найдет и добавит в нужные поля всю информацию:
- изображение предпросмотра,
- альтернативный текст,
- кнопку воспроизведения.
Блок со встроенным видео готов!
Добавляем ссылки к контактам
Обычно в футере или хедере содержится контактная информация компании, например, контакты, email и т.д. Если у клиентов есть какие-то вопросы, они могут связаться с вами по электронной почте, Skype или телефону.
Для того чтобы клиент написал вам на почту, ему необходимо выделить email, скопировать его, открыть свой почтовый ящик и там вставить его и написать сообщение. Мало кто не поленится это сделать. Будет удобнее, если вы просто добавите в письмо ссылку “:mailto”. Это позволит клиенту написать вам письмо, просто нажав на нужный email:
-
перетащите в шаблон новую структуру;
-
вставьте текстовый блок в эту структуру;
-
введите свой текст, в данном случае это email;
-
далее выделите нужный текст и присвойте ему ссылку:
-
на боковой панели редактора в поле “Ссылка” вам подтянется нужный тип (почта, телефон и т.д.):
Точно так же можно поступить и с номером телефона, чтобы у читателя была возможность сразу же с вами связаться:
-
перетащите в шаблон новую структуру;
-
вставьте текстовый блок в эту структуру;
-
введите свой текст, здесь это номер телефона;
-
далее выберите нужный текст и присвойте ему ссылку;
-
на боковой панели редактора в поле “Ссылка” выберите “Телефон” и напишите свой номер в международном формате:
Такую же процедуру можно проделать и со Skype, выбрав в ссылке “Skype”. Создавать новую структуру необязательно, в любом текстовом блоке можно выделить нужное слово и подобрать для него нужный тип ссылки.
Обратите внимание! Ссылка :mailto не работает в Outlook.mail и iOS, но в Gmail, на ОС Windows и на устройствах Android она открывается корректно.
Добавляем ссылки в иконки соцсетей
Некоторые маркетологи вставляют иконки соцсетей в меню или хедер, но большинство – в футер. Где их лучше разместить, решать вам.
Чтобы привязать ссылки к иконкам соцсетей в редакторе eSputnik, нужно:
-
добавить в шаблон структуру с блоком;
-
перетащить в него блок соцсетей;
-
кликнуть по нему, чтобы активировать боковую панель в редакторе;
-
вставить соответствующие ссылки:
Если вы хотите изменить вид иконок или добавить другие значки, это тоже можно сделать в боковой панели редактора:
Обратите внимание! Всю эту работу при создании каждого письма можно не делать. Просто сохраните нужный блок/структуру/полосу в библиотеку ваших модулей. При создании нового письма перетащите из модулей нужный вам блок в тело письма.
Добавляем ссылки в кнопки СТА
Непосредственная цель кнопок СТА – призыв к действию, поэтому их нужно делать как можно примечательней.
Чтобы добавить ссылки на СТА в редакторе eSputnik, необходимо:
-
поместить блок “Кнопка” в то место письма, где вы хотите его видеть;
-
присвоить кнопке название;
-
указать цвет текста;
-
задать шрифт и размер текста;
-
задать цвет кнопки;
-
присвоить ссылку:
Больше возможностей для кнопки узнайте из статьи “Как сверстать кнопку в письме”.
Хотите доступ к 300+ шаблонам?
Добавляем ссылки в пункты меню
Меню чаще всего перенаправляет клиента из письма на конкретную страницу сайта.
Разберемся, как добавить ссылки для пунктов меню с помощью редактора eSputnik:
-
вставьте в письмо структуру;
-
перетащите блок “Меню”;
-
выберите нужный тип меню (ссылки, иконки, ссылки и иконки);
-
дайте название каждому пункту/загрузите иконку и подставьте нужные ссылки:
Добавление страницы отписки
По правилам ведения рассылок, в письме всегда должна быть ссылка, перейдя по которой, клиент может отписаться от рассылки. Обычно эта ссылка находится в футере.
Добавить ссылку на отписку можно так:
-
Вставьте в письмо структуру;
-
Выберите слово “Отписаться” и прикрепите к нему ссылку:
-
В типе ссылки выберите “Отписка”:
-
Теперь, нажав на это ссылку в письме, пользователь сможет отказаться от получения ваших писем.
Если ваше письмо получилось длинным или вы хотите, чтобы пользователь мог открыть его отдельной страницей в бразуере, вместо отписки вы можете прописать “Просмотреть письмо в браузере” и поставить тип ссылки “Поставить в браузере”:
Якорные ссылки
Якорные ссылки в письме нужны для того, чтобы перенести юзера в конкретный раздел письма. С помощью таких ссылок получателям легче пропустить не интересующие их части письма, а сразу перейти к целевым. Если ваше письмо получается длинным, используйте якорные ссылки, чтобы упростить клиенту чтение письма или перевести его в нужный раздел письма.
Вот так выглядит пример якорных ссылок в письме:
Вариант добавления якорных ссылок №1.
-
Щелкните по тому месту письма, на которое вы хотите направить ваших клиентов;
-
откройте редактор кода (откроется код выбранного элемента);
– этот кусочек кода необходимо подставить в ваш код. Label обозначает название места, на которое нужно направить читателя:
-
после этого перейдите в нужный вам блок, с которого пользователи перейдут в нужный раздел письма;
-
кликните по нему;
-
в панели настроек выберите тип ссылки “Другой”:
-
введите в поле “Ссылка” #label
все!
Вариант добавления якорных ссылок №2.
-
Создайте панель меню для хедера. Нажимая на пункты меню, получатели будут переходить к нужным разделам письма:
-
вставьте HTML-блок со ссылкой над разделом, в который вы хотите направить клиента, если он нажмет на соответствующий пункт меню:
-
кликните по этому блоку, чтобы открыть редактор HTML-кода:
Тут label обозначает название пункта меню, к которому вы собираетесь прикрепить якорную ссылку;
-
теперь перейдите в нужный пункт меню в хедере, чтобы связать необходимый раздел письма с ним;
-
выделив пункт меню, откройте редактор кода:
-
в редакторе кода между кавычками после href= в нужном пункте меню необходимо вставить якорь #label:
-
то же самое сделайте с остальными пунктами меню.
Список почтовых клиентов, которые поддерживают якорные ссылки:
Ссылки – крайне важная часть каждого письма, они помогают клиентам в навигации и позволяют маркетологам отслеживать их действия. Не забывайте проверять корректность работы ссылок перед запуском рассылки. Чтобы сделать это, необходимо отправить тестовое письмо.
Если у вас остались вопросы, задавайте их в комментариях.