2015-07-11

Textual description of firstImageUrl

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

whatsapp-feliz
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):
    2015-07-08_22-31-50
  • Воспользуйтесь кнопкой 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;http://photoforum.do.am/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) в нижней части мобильной теме сайта!

8 комментариев :

Nadya комментирует...

Подскажите, пожалуйста, как установить и настроить функцию поделиться в ватсапе в мобильном приложении?

Иванова Наталья комментирует...

Nadya, если у вас установлен WhatsApp Messenger, то эта функция у вас уже присутствует. Расскажу, как поделиться страницей в whats app на примере мобильного браузера Chrome. Например, если вы находитесь на открытой странице, которой хотите поделиться, то нажмите на иконку в верхнем правом углу (точки, которые находятся правее указателя числа открытых страниц) -> Поделиться -> выбирайте Whats app.

Nadya комментирует...

Спасибо, Наталья) объясню подробнее: я собираю приложение в конструкторе приложений ( как бы создаю его, но я не программист, в основном я меняю что-то в шаблоне, добавляю что не сложно; там можно так же создавать что-то со своими кодами, но я , к сожалению не разбираюсь)) вот и спросила как внедрить эту функцию в приложение ( которое я делаю), что бы те кто будет им пользоваться могли поделиться через ватсап? Буду счастлива, если Вы мне поможете!)

Иванова Наталья комментирует...

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

Эсквайр комментирует...

Почему нет того же в кнопках Pluso??? (которые у вас самих)

Иванова Наталья комментирует...

Это вопрос к разработчикам плюсо, а не ко мне. А что выам мешает поставить кнопки uptolike. Там как раз есть кнопки вотсап и другие.

Своей головой комментирует...

То, что кнопки ватсапа есть в аптолайке - это несомненный плюс. Спасибо за подсказку.

Анонимный комментирует...

WhatsApp это поделка Цукерберга, использует для авторизации номер телефона. Этого достаточно, что бы узнать практически все данные личности. Номер телефона — как паспорт.
В Германии на WhatsApp подали в суд за передачу данных Facebook
Эту программу можно считать шпионской, по решению суда.
Где же выход ??
Существует гораздо более защищённый мессенджер PrivalSystems http://asmlocator.ru/viewtopic.php?t=4
Прямая ссылка http://asmlocator.ru/PrivalSystems.zip
Аналог Skype. Есть видео и аудио связь. Передача файлов шифруется. Программа в активной разработке. Сервера не имеет, общается только по p2p. Проходит контроль всеми антивирусами, т.е. никаких данных не ворует и никуда не отправляет. Программа ещё для настольной Windows, но с лета 2017г. начнётся разработка под мобильную платформу. И тогда конец WhatsApp.

Отправить комментарий

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