Как добавить кнопку whatsapp на сайт

Whatsapp – популярное приложение для обмена бесплатными сообщениями на мобильном, поэтому установка на сайт кнопки Whatsapp поможет делиться вашим контентом и ссылками пользователей. Нажимая на кнопку, ваш читатель легко может отправить ссылку другу или даже группе друзей.
Из этой статьи вы узнаете, как установить кнопку whatsapp на любом сайте, в частности на Blogger и WordPress.
Читайте также:
- как установить whats app на компьютер
- мобильные кнопки от uplolike для установки кнопок шаринга для мобильных устройств. Это те же кнопки вотсап, вайбер и другие.

Кнопка Whatsapp на мобильную версию Blogspot

С помощью генератора WhatsApp Sharing Button Generator
Кнопка Whatsapp должна работать именно на мобильном шаблоне (читайте подробнее о настройки мобильного blogger)  и не показываться на основной версии блога.

• Админпанель blogger –> Шаблон –> На мобильных –> значок шестеренки (настроить мобильный шаблон) –> дополнительно:
  
  (кликните для увеличения)
• Перейти на сервис – генератор кнопки вотсап
• Настроить собственные надписи для кнопки и сопроводительного текста ссылки + сама ссылка (при необходимости):
  
• Админпанель –> вкладка “Шаблон” –> найти отрезок кода мобильных кнопок соцсетей: <div class='mobile-link-button goog-inline-block' id='mobile-share-button'> Сразу после него добавить первый код с сайта (и пункта 3):
  
• Воспользуйтесь кнопкой Download для того, чтобы скачать архив со скриптом кнопки whatapp (пункт 4 в генераторе).
• На компьютере распакуйте архив, зайдите в папку dist и найдите файл whatsapp-button.js . Этот файл нужно закачать на хостинг. Если у вас нет хостинга, как у большинства блоггеров, ведущих свои блоги на Blogger, то вы можете закачать файл на dropbox или в файловый менеджер на ucoz.
• Скопируйте код из окошка в пункте 5 на сервисе whatsapp sharing. В предлагаемом коде вам нужно лишь заменить отрезок url/to/your/button/whatsapp-button.js на вашу ссылку на скрипт кнопки вотсап
  Этапы 5, 6 и 7можно пропустить, если вы хотите пойти по простому пути. Тогда воспользуйтесь просто моим кодом (эти шаги я сделала за вас). А вот и сам код (его нужно вставить в шаблон блога до элемента </body>: /*
  

  <script type='text/javascript'>if(typeof wabtn4fg===&quot;undefined&quot;){wabtn4fg=1;h=document.head||document.getElementsByTagName(&quot;head&quot;)[0],s=document.createElement(&quot;script&quot;);s.type=&quot;text/javascript&quot;;s.src=&quot;https://spishu.ru/files/whatsapp-button.js&quot;;h.appendChild(s);}</script>

• Сохраняйте изменения. Все должно работать!

Кнопка Whatsapp на сайт wordpress

• Для установки кнопки вотсап на wordpress вы можете воспользоваться плагином Mobile ShareBar с настройками:
  
• Второй способ – это воспользоваться все тем же генератором - WhatsApp Sharing Button Generator
  Принцип установки кнопки на блог wordpress такой же, как и в Blogger. Однако здесь свои нюансы, поэтому расскажу подробнее.
  Во втором пункте генератора измените название кнопки (если нужно), напишите сопутствующий текст (Sharing text), а также вы можете указать конкретную страницу или оставить  Current page url (страница, которой собирается делиться ваш читатель).
  Пункт 3 генератора – код кнопки. Возьмите его и вставьте в нужное место шаблона вашего блога. Это может быть виджет, начало или окончание статьи и пр.
  4 пункт сервиса. Нажмите на кнопку “Download” и скачайте архив, распакуйте на компьютере и залейте файл whatsapp-button.js из папки dist на свой хостинг.
  Скопируйте код из пятого пункта, предварительно заменив url/to/your/button/whatsapp-button.js на свою ссылку на файл и вставьте полученный код в файл Footer.php перед закрывающимся тегом </body>.
  Эта кнопка не будет видна в десктопной версии сайта, а в мобильной вы увидите работающую кнопку Whatsapp:
  

Следите за обновлениями, и вы узнаете как сделать классные кнопки социальных сетей (в том числе и whatsapp) в нижней части мобильной теме сайта!