Ссылка на Вотсап в профиле Инстаграм поможет направить потенциальных клиентов в мессенджер. Например, это удобно для записи клиентов или оформления заказов в интернет-магазине.
Также, размещение ссылки на Вотсап, может помочь увеличить активность посетителей вашей страницы, повысить конверсию и более оперативно отвечать потенциальным клиентам.
Как добавить ссылку на WhatsApp в профиль Инстаграм
Есть три способа добавить ссылку на Вотсап в шапку профиля в Инстаграм. Первый — разместить ссылку в поле веб-сайт, второй — настроить специальную кнопку, третий — QR-код. Далее подробнее рассмотрим каждый из них.
Ссылка на чат
Прежде чем добавить ссылку в профиль, её сначала нужно создать. В WhatsApp есть функция, которая позволяет сделать ссылку, которая позволит начать чат с нужным контактом. Нажав на ссылку в Инстаграм, пользователь автоматически попадёт в чат WhatsApp.
Чтобы сгенерировать ссылку, используйте следующий формат: https://wa.me/номер_телефона и напишите свой номер в международном формате. При этом, нули, скобки и дефисы использовать нельзя.
КАК СДЕЛАТЬ ССЫЛКИ НА TELEGRAM, WHATSAPP, VIBER, ТЕЛЕФОН, EMAIL НА САЙТЕ?
Примеры:
- Правильно: https://wa.me/7XXXXXXXXXX
- Неправильно: https://wa.me/+7-(XXX)XXX-XX-XX
Также, можно сделать ссылку с автоматическим сообщением, которое будет показываться в текстовом поле чата.
Шаблон ссылки:
- https://wa.me/7XXXXXXXXXX?text=Я%20хочу%20в%20заказать%20доставку%20цветов.
Теперь нужно разместить ссылку. Для этого открываем Инстаграм, переходим на главную страницу и жмём «Редактировать профиль».
Открывается новое окно, где в поле «Сайт» вставляем ссылку и нажимаем «Готово», чтобы подтвердить изменения.
Кнопка WhatsApp
Второй способ позволяет настроить кнопку, ведущую на чат с вами и оставить раздел сайт под другую ссылку.
Шаг 1. Заходим в магазин приложений и устанавливае приложение WhatsApp Business бизнес себе на телефон.
Шаг 2. Синхронизмируем его с обычным Вотсапом — будут перенесены все чаты, так что ни одна переписка не пропадёт.
Шаг 3. Далее настравиваем бизнес аккаунт: название, аватар, описание и прочее.
Шаг 4. Когда настройка профиля WhatsApp Business завершена, переходим в Инстаграм. Жмём «Редактировать профиль» и далее выбираем «Способы связи».
Шаг 5. Выбираем «Номер телефона WhatsApp Business».
И вписываем номер телефона, который используется в мессенджере.
Готово! Теперь в профиле будет показываться лаконичная кнопка на чат с вами.
QR-код
Актуально только для WhatsApp Business. QR-код на чат можно опубликовать в сторис, в виде поста или закрепить в актуальном.
Чтобы сделать QR-код, ведущий на чат:
- Откройте приложение WhatsApp Business.
- Нажмите «Настройки – Инструменты для бизнеса – Короткая ссылка».
- Нажмите «QR-код – Поделиться кодом».
WhatsApp кнопка для сайта с анимацией
Сегодня разберем, как сделать красивую анимированную кнопку для связи по WhatsApp прямо с сайта. Делать мы это будем без плагинов, только при помощи CSS. Поэтому данный способ подойдёт для любого сайта. Ну а разбирать мы всё это будем, конечно же, на примере самой популярной CMS WordPress.
Ссылка для перехода в Whatsapp
Для начала рассмотрим, как выглядит ссылка на чат в Whatsapp для сайта.
А вот она в виде HTML кода:
Вместо phone=79260000000 вставляем нужный номер
Этот код можно вставить в любом месте, как простую ссылку. Добавив к нему соответствующие стили, можно сделать с помощью этого кода обычную или фиксированную кнопку. Чем мы сейчас и займёмся.
Кнопка Whatsapp в углу экрана с анимацией
Первый вариант кнопки whatsapp для сайта делается довольно просто и её легко отредактировать, если вам понадобится поменять цвет или размеры.
Для создания нашей кнопки, мы будем использовать иконку Font Awesome. Для этого ваш шаблон должен поддерживать данный шрифт. Если нет, то необходимо его подключить. Если вы не знаете, как это сделать, то можно воспользоваться плагином Font Awesome — он автоматически подключит библиотеку иконок.
HTML код:
CSS код:
CSS для мобильной версии сайта:
Если вам необходимо поменять местоположение кнопки на мобильных устройствах, то добавьте к стилям CSS следующий код.
Кнопка Whatsapp — вариант 2
Данная кнопка имеет более сложную анимацию и эффект появления надписи при наведении.
HTML код:
CSS код:
Установка кнопки на WordPress
В админ панели WordPress переходим в раздел «внешний вид/редактор тем». Далее, в зависимости от структуры вашей темы, заходим в нужные файлы вносим правки. HTML код обычно вставляют в файл footer.php (перед закрывающим тегом ), а CSS в конец файла style.css.
Современные шаблоны могут иметь более сложную структуру, несколько файлов css и прочее, поэтому можно воспользоваться плагинами.
Например, для вставки HTML подойдут такие плагины, как «DCO Insert Analytics Code», «Head , «Woody Snippets» и им подобные. А для добавления CSS подойдёт плагин «Custom CSS» или «SiteOrigin CSS».
Источник: bisarts.ru