Как добавить кнопку whatsapp на сайт — Кнопка whatsapp для сайта с открытием прямого чата Android, IOS

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

Навигация по записи

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

это проблема со стороны самого ватсапп, я думаю потом исправят, так как до этого было все хорошо.

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

ну сначала определись, куда ты хочешь вставить в сайте, футер, хедер, можно у товара рядом, например, потом после определения места узнай в интернете, какой шаблон битрикса отвечает за отрисовку этого блока, и в консоли браузера (левой кнопкой мышки на месте где нужно вставить — «посмотреть код элемента» и вот там посмотри, а потом найди этот же код в шаблоне битрикса (то есть темы оформления сайта) и вставь, если вставишь не туда, попробуй методом тыка, иначе никак) Можешь загуглить, в каком шаблоне искать нужный элемент, там и структура папок будет и ответ на вопрос куда вставлять

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

Приветствие от клиента? Это что-то новое. То есть, чтобы клиент при клике сразу автоматически отправлял сообщение настроенное вам?

Например https://api.whatsapp.com/send?phone=79135758683&text=Здравствуйте%20🙂

отлично, можно добавить в тему, я просто никогда не думал, что может понадобиться подобное

а как действие завершить? чтобы оно именно отправилось?

К сожалению последний вариант не работает на компьютере в браузерах 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 >

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