Как сделать ссылку Click to Call в WordPress (шаг за шагом)

Опубликовано: 2021-08-19

Знаете ли вы, что в 2020 году 68% посещений веб-сайтов были совершены с мобильных телефонов?

Точно так же только в первом квартале 2021 года на мобильные телефоны (за исключением планшетов) приходилось 54,8% глобального трафика веб-сайтов.

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

Не знаете, о чем мы говорим?

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

Начнем с введения:

Оглавление

  • Что такое ссылка Click-to-Call в WordPress?
  • Почему вы должны добавить ссылку Click-to-Call в WordPress?
  • Как работает интерактивная ссылка
  • Как сделать ссылку Click-to-Call в WordPress
    • Способ 1: Создание ссылки Click-to-Call с помощью плагина
    • Способ 2: добавление ссылки Click-to-Call с помощью HTML
    • Способ 3: добавление ссылки Click-to-Call в заголовок WordPress
  • Часто задаваемые вопросы
    • Как сделать ссылку для клика в HTML?
    • Как работает интерактивный звонок?
    • Как добавить кнопку «Позвонить сейчас» на сайт?
  • Вывод

Что такое ссылка Click-to-Call в WordPress?

По сути, ссылка для звонка по клику — это интерактивная ссылка, которая позволяет вашим мобильным пользователям звонить в вашу компанию одним нажатием на контактную информацию, которую вы добавили на свой сайт. Число мобильных пользователей растет, и количество посещений Интернета с мобильных телефонов значительно выше. Таким образом, интерактивные ссылки широко используются на большинстве веб-сайтов.

Почему вы должны добавить ссылку Click-to-Call в WordPress?

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

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

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

Таким образом, телефонная ссылка «нажми и звони» является более удобным и простым способом для ваших посетителей связаться с вашей компанией.

Как работает интерактивная ссылка

Ссылка «Позвони по клику» — это гиперссылка в формате HTML, которая позволяет вашим посетителям связаться с вами в режиме реального времени. HTML 5 включает протоколы tel: и mailto:, которые могут использовать веб-браузеры.

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

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

Еще одним важным преимуществом использования ссылки «Позвони по клику» в WordPress является конкретизация вашего маркетинга. Вы можете отслеживать клики по номеру телефона на своем веб-сайте и знать, откуда посетители приходят на ваш сайт. Вы можете использовать эту информацию для создания персонализированных маркетинговых кампаний и показа нужной информации нужным людям в нужное время.

Как сделать ссылку Click-to-Call в WordPress

Есть три способа сделать и добавить ссылку для вызова в WordPress. Мы подробно описали их шаг за шагом. Прочтите их ниже:

Способ 1: Создание ссылки Click-to-Call с помощью плагина

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

Шаг 1: Установка и активация плагина

  • Перейдите в панель управления WordPress. Нажмите « Плагины» > «Добавить новый» .
добавить новый плагин из панели управления
  • Найдите плагин « WP Call Button ». Установите и активируйте его.
Установка и активация плагина WP Call Button

Шаг 2: Настройка плагина

После активации плагина WP Call Button его необходимо настроить. Перейдите в « Настройки»> «Кнопка вызова WP » на панели инструментов.

Настройка плагина WP Call Button

Вы можете настроить плагин с помощью кнопки «Залипание вызова» или «Кнопка статического вызова». Липкая кнопка перемещается вместе с пользователем, когда он прокручивает и просматривает ваш сайт, в то время как статическая кнопка остается неподвижной.

два варианта настройки кнопки вызова WP

#Настройка залипающей кнопки вызова

Сначала включите статус кнопки «Позвонить сейчас» , чтобы активировать функцию закрепленной кнопки вызова на вашем веб-сайте. При создании залипающей кнопки вызова вы найдете четыре стандартных настройки. Заполните информацию соответствующим образом:

  • Текст кнопки вызова — введите, какой номер телефона будет отображаться на вашем сайте. Вы также можете добавить код своей страны.
  • Положение кнопки — настройте, как кнопка будет отображаться на вашем веб-сайте.
  • Цвет кнопки вызова — выберите цвет кнопки вызова.
  • Видимость — скрыть кнопку вызова на определенных страницах.

Если вы хотите, чтобы кнопка вызова отображалась на мобильных устройствах, а не на рабочем столе, вы можете включить кнопку вызова только для мобильных устройств. Сохраните изменение в конце.

кнопка вызова только на мобильных устройствах

Теперь на вашем сайте появляется кнопка вызова, которая перемещается вместе с прокруткой.

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

#Настройка кнопки статического вызова

Если вы работаете в классическом редакторе WordPress, вам необходимо настроить кнопку статического вызова.

  • Перейдите на вкладку «Кнопка статического вызова» вверху.
  • Теперь введите текст кнопки вызова и выберите цвет кнопки вызова.
  • При этом в конце генерируется шорткод. Вам нужно скопировать его.
копирование шорткода для статической кнопки вызова

Теперь вставьте шорткод на свою страницу/публикацию, где вы хотите добавить кнопку вызова. Мы рекомендуем вставить его на странице контактов . Статическая кнопка вызова имеет больше смысла.

Это будет выглядеть примерно так:

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

Вы также можете опубликовать свою кнопку вызова с помощью редактора блоков следующим образом:

  • Нажмите на значок добавления в редакторе блоков.
  • Выберите опцию « Кнопка вызова WP ».
добавление кнопки WP Call в редакторе блоков
  • Вы можете настроить цвет кнопки вызова, размер шрифта, положение и многое другое с правой стороны.

Добавление кнопки вызова в виджет

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

  • Перейдите в раздел « Внешний вид» > «Виджеты » на панели инструментов.
перейти к виджету
  • Прокрутите до виджета « Кнопка вызова WP ».
  • Перетащите его в нижний колонтитул, заголовок, боковую панель или другие области виджетов, где вы хотите добавить кнопку вызова.
добавление виджета кнопки вызова WP на боковую панель
  • Вы также можете нажать на него и выбрать, куда вы хотите добавить виджет.
  • Нажмите кнопку « Изменить », чтобы изменить заголовок, описание, цвет и другие параметры.
редактировать виджет кнопки вызова WP

Итак, вот как вы делаете кнопку «нажми-нажми» с помощью плагина WP Call Button . Это самый простой и удобный способ добавить кнопку вызова на ваш сайт WordPress. Это бесплатный инструмент, который также интегрируется с Google Analytics.

Способ 2: добавление ссылки Click-to-Call с помощью HTML

Вы также можете добавить ссылку для звонка вручную, используя фрагмент кода HTML. Этот метод использует простой фрагмент кода HTML для открытия телефонных ссылок на мобильных телефонах. В Windows 10 он открывает Skype, а в Mac — Facetime.

Вы можете добавить ссылку на кнопку вызова с помощью HTML следующим образом:

  • Сначала откройте сообщение или страницу, где вы хотите добавить свой рабочий номер телефона с кодом страны.
  • Добавьте блок HTML.
Добавление блока HTML

Теперь добавьте следующий фрагмент кода в этот блок HTML:

 <!--This link will work on Android and iPhone. It will be visible to desktop users but will result in an error when clicked --> <a href="tel:+15555551212">+1 (555) 555-1212</a> <a href="tel:15555551212">Call Me</a>
  • Наконец, опубликуйте его, чтобы увидеть на своем веб-сайте.

Рядом с интерактивной ссылкой можно добавить значок или изображение. Вот как:

  • Перейдите в раздел « Медиа» > «Добавить новый » на панели инструментов.
Добавление новых медиа
  • Загрузите свою иконку.
  • Теперь отредактируйте значок после завершения загрузки.
  • Скопируйте URL-адрес файла с экрана редактирования.
копирование URL-адреса мультимедиа

Наконец, перейдите к сообщению/странице, где вы хотите добавить ссылку на звонок со значком. Добавьте блок HTML, как и раньше, и вставьте следующий фрагмент кода:

 <a href="tel:+15555551212"><img src="paste-url-here" alt="Call us" /></a>
  • Не забудьте заменить URL-адрес здесь на тот, который вы скопировали ранее. Затем опубликуйте его.

Способ 3: добавление ссылки Click-to-Call в заголовок WordPress

Вы также можете добавить ссылку для звонка по клику в заголовок вашего сайта или в меню навигации. Таким образом, кнопка вызова будет первым, что заметят ваши посетители. Чтобы добавить ссылку вызова с помощью этого метода, выполните следующие действия:

  • Перейдите к опции « Внешний вид»> «Меню » на панели инструментов.
Перейти в меню
  • Нажмите на опцию « Пользовательская ссылка » в правом столбце.
  • Введите свой номер телефона в URL в формате «Tel:+144444444».
  • В поле « Текст ссылки » введите метку, которую вы хотите присвоить своей ссылке вызова.
  • Нажмите на кнопку « Добавить в меню ».
Добавление пользовательской ссылки в меню

Часто задаваемые вопросы

Как сделать ссылку для клика в HTML?

Вы можете сделать ссылку для клика в HTML, добавив следующий код в HTML-блок WordPress:

<!–Эта ссылка будет работать на Android и iPhone. Он будет виден пользователям настольных компьютеров, но при нажатии на него появится ошибка ->
<a href="тел:+ 15555551212"> +1 (555) 555-1212</a>
<a href="tel: 15555551212"> Позвоните мне</a>

Замените выделенную часть контактным номером вашего бизнеса.

Как работает интерактивный звонок?

Click-to-call — это HTML-ссылка, которая работает с протоколами tel: и mailto:. Эти протоколы позволяют браузерам запрашивать звонки и инициировать разговоры.

Как добавить кнопку «Позвонить сейчас» на сайт?

Вы можете добавить кнопку «Позвонить сейчас» на свой веб-сайт с помощью плагина WP Call Button или вручную ввести фрагмент HTML-кода WordPress. Мы подробно объяснили эти методы. Проверь их.

Вывод

Итак, это были три простых способа сделать интерактивную ссылку в WordPress. Мы рекомендуем использовать плагин, так как это более быстрый, безопасный и удобный метод. Для пользователя любого уровня это будет проще и удобнее по сравнению с другими методами. Тем не менее, ручной метод также работает так же хорошо. Но вам нужно немного больше работать с кодами здесь и там.

Какой способ показался вам легким? Дайте нам знать об этом в комментариях.