Кнопка whatsapp для сайта с открытием прямого чата (изменено)


Апрель 3, 2017

Кнопка whatsapp для сайта с открытием прямого чата

Все как-то хотел реализовать нормальную человеческую кнопку whatsapp для сайта, чтобы при клике на нее открывался прямой чат с нужным номером без надобности добавлять в записную книжку и т.д. (Наконец таки появилось нормальное решение от разработчиков - см в конце статьи.)

Суть проблемы - почему-то нет кроссплатформенного решения для кнопки whatsapp

Я на всех форумах натыкался как обычно на одно решение - что дали разработчики самого Whatsapp

<a href="whatsapp://send?text=The text to share!" data-action="share/whatsapp/share">Share via Whatsapp</a>

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

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

Что мы имеем в данный момент по поводу реализации кнопки на сайте

  • Кнопка работает только на андроиде
  • Для айфонов и компов необходимо эту кнопку НЕ ПОКАЗЫВАТЬ, а заменить ее дивом аля "пишите нам в ватсапп 8906ххххххх"
  • Для компов и мобил показывать разные варианты дивов

Как все получилось реализовать

Может уже появилось что-то лучше и удобнее, но делюсь с вами тем что удалось сделать самому.

<?php //Для начала узнаем с какого девайса зашли на сайт
$iPod = stripos($_SERVER['HTTP_USER_AGENT'],"iPod");
$iPhone = stripos($_SERVER['HTTP_USER_AGENT'],"iPhone");
$iPad = stripos($_SERVER['HTTP_USER_AGENT'],"iPad");
$Android = stripos($_SERVER['HTTP_USER_AGENT'],"Android");
if( $Android !== false ) { //Если это андроид, то показываем кнопку, при нажатии которой сразу кинет в чат с номером
echo '<a href="intent://send/+7916ХХХХХХ#Intent;scheme=smsto;package=com.whatsapp;action=android.intent.action.SENDTO;end" target="_blank">Написать в WhatsApp</a>;';
}
else {
echo 'WhatsApp: 8(916)ХХХХХХХХ'; // Иначе просто выводим инфу о том что можно написать в ватсапп
}
?>

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

Кнопка whatsapp для сайта с открытием прямого чата

У нас получилась отличная кнопка, которая на телефоне с андроидом на борту откроет чат с нужным номером, а на неподдерживаемых устройствах просто выведет блок с номером.

Обновленная версия

Теперь все стало гораздо проще - просто в коде вставляем

<a href="https://api.whatsapp.com/send?phone=79163377352" target="_blank">Написать в WhatsApp</a>;

Телефон должен начинаться с кода страны и знак плюс"+" указывать не нужно.


Также рекомендую к ознакомлению


avatar
  Подписаться  
Уведомление о
Михаил
Гость
Михаил

Сейчас WhatsApp и на ПК есть. Но по новой ссылке открывается диалог установки Веб Версии. Даже если приложение стоит. Как сделать так, чтобы если на ПК стоит WhatsApp, открывалось в нём?

Эмиль
Гость
Эмиль

я ничего не парю в кодах
но поставлена задача сделать кнопку ватсап на сайте
cms битрикс 1с
куда там вставлять? после какого тэга??

Сергей
Гость
Сергей

Доброе утро. Нужна помощь. Кто знает как делать, чтобы по щелчку на ватсап открывался диалог и от клиента сразу шло приветствие?

Сергей
Гость
Сергей

К сожалению последний вариант не работает на компьютере в браузерах Firefox и Opera.
А вот такая ссылка открывается — < a title="WhatsApp" href="https://web.whatsapp.com/send?phone=79163377352" target="_blank" rel="nofollow">WhatsApp< /a >
Но она не открывается в Андроиде.
Поэтому для Андроида выводим — < a href="//send/+7916ХХХХХХ#Intent;scheme=smsto;package=com.whatsapp;action=android.intent.action.SENDTO;end" target="_blank" rel="nofollow">Написать в WhatsApp< /a >
а для Firefox, Opera и Chrome — < a title="WhatsApp" href="https://web.whatsapp.com/send?phone=79163377352" target="_blank" rel="nofollow">WhatsApp< /a >

Последние комментарии