Дизайн и конверсия

Как сделать кнопку-ссылку на сайте?

Наталья, Оренбург 2 тыс. просмотров

Делаю лендинг сама в конструкторе, нужна кнопка "Написать в WhatsApp", которая выглядит как обычная кнопка, а не как синяя подчёркнутая ссылка. В настройках блока нашла только текстовые ссылки, кнопки отдельно нет.

Дмитрий Акиндинов разработчик лендингов, 15 лет практики

ответил

Кнопка-ссылка на сайте технически остаётся тем же тегом a, что и обычная текстовая ссылка, просто оформленным через CSS как кнопка: с фоном, отступами по бокам, скруглёнными углами и без подчёркивания. Браузеру всё равно, ссылка это или кнопка, разница только в оформлении, которое вешают стилями.

В большинстве конструкторов такой блок называется не "ссылка", а "кнопка" или "CTA-кнопка" в списке элементов - ищите его отдельно от текстовых блоков. Внутри настроек указывается адрес перехода: для мессенджера это ссылка вида https://wa.me/79123456789 или t.me/username, для телефона - tel:+79123456789, для почты - mailto:info@site.ru. Именно с этими префиксами клик по кнопке с телефона сразу открывает нужное приложение, а не просто копирует текст.

Если ссылка ведёт на внешний сайт, а не на мессенджер, добавляйте атрибут target="_blank", чтобы страница открылась в новой вкладке и человек не потерял ваш лендинг, и rel="noopener" рядом с ним - это защищает от одной старой уязвимости с доступом новой вкладки к прежней странице.

Когда кнопка ведёт не на форму, а сразу в мессенджер или на звонок, полезно ещё проверить, как ссылка выглядит при пересылке: если её скопируют и отправят в чат, покажется превью с картинкой и заголовком сайта, и тут уже важны настройки og-тегов на самой странице, а не кнопки.

Подробный разбор Как выглядит ссылка на лендинг при репосте: OG-превью и фавикон
Не нашли свой вопрос

Задайте его напрямую

Отвечаю сам, на почту, обычно в тот же день. Разбор самых частых вопросов потом попадает в этот раздел.

Похожие вопросы

Все вопросы темы "Дизайн и конверсия"

Помогу выбрать

Сомневаетесь — напишите, разберёмся за 10 минут

Расскажете про ваш бизнес и задачу — подскажу, что нужно: лендинг, многостраничник или вообще не сайт. Без обязательств, бесплатно.

Отвечаю в течение 15 минут в рабочее время (будни 11:00–20:00 МСК). Если удобнее e-mail: 9123578@gmail.com

Telegram TG MAX MAX Звонок