Как сделать кликабельный номер телефона на сайте wordpress

Как добавить кликабельный номер телефона на сайте WordPress

Смартфоны правят миром. Думаю, не нужно говорить о том, как смартфоны изменили мир и на что они способны.

Также знаем, что в современном обществе каждый создаваемый вами сайт должен быть отзывчивым. Но что происходит с номерами телефонов, которые вы добавляете в своих постах и страницах WordPress?

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

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

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

Добавьте кликабельный номер телефона

Если вам просто нужно добавить на свой веб-сайт номер телефона, по которому можно кликнуть, вам не нужно устанавливать дополнительные плагины. Вы можете сделать это с помощью простой строки HTML-кода, которая фактически совпадает с обычной ссылкой. Давайте посмотрим, насколько это легко:

• Откройте сообщение в текстовом редакторе или, откройте код шаблона WordPress
• Вставьте следующую строку:

• Смените номер телефона на свой
• Сохраните, опубликуйте или обновите свой пост.

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

Использование Skype звонков.

Но что, если вы хотите, чтобы ваши посетители могли выбирать между обычным и skype звонком? Тогда вам просто нужно изменить протокол в ссылке. Итак, вместо протокола TEL, используйте протокол CALLTO:

Или вы можете сделать так, чтобы по умолчанию звонок шел через Skype:

Использование СМС

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

Как добавить кнопку вызова с помощью бесплатного плагина.

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

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

Это плагин Call Now Button

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

Если у вас есть учетная запись Google Analytics, связанная с вашим веб-сайтом, этот плагин позволяет отслеживать телефонные звонки, создавая событие для каждого сделанного клика. После настройки плагина подождите не менее 24 часов, прежде чем Google Analytics покажет данные.

Кода вы установите и активируете плагин Call Now Button, зайдите в его настройки. Перед вами откроются три вкладки. На первой вкладке введите свой номер телефона, а также текст, который будет показан на кнопке.

Далее перейдите на вкладку Presentation. Выберите здесь цвет кнопки, позицию кнопки, а также введите те ID постов, на которых вы хотите отобразить кнопку, или выберите опцию Exclude these posts and pages и введите те ID постов, на которых кнопка вызова не должна появлятся.

И на вкладке Advanced вы можете добавить дополнительные настройки, такие как отслеживание ваших звонков с помощью Google Analitics и других настройках.

И вот как будет выглядеть готовая кнопка вызова.

Как и во многом другом, в WordPress создание кликабельных номеров телефонов совсем не сложно. И это можно сделать буквально в несколько кликов.

А если у вас остались ещё вопросы, то задавайте их в разделе с комментариями, и я с радостью на них отвечу.

WordPress как сделать телефон кликабельным?

Чтобы сделать телефон на вашем сайте WordPress кликабельным, вам нужно добавить ссылку на телефонный номер с протоколом «tel:». Это позволит пользователям кликнуть на номер телефона и набрать его с помощью своего мобильного устройства.

Существует несколько способов добавления кликабельных телефонных номеров на ваш сайт WordPress, вот некоторые из них:

1. Вставить ссылку на телефон в текстовый редактор:

• Откройте страницу или запись, где нужно добавить кликабельный номер телефона.
• Выберите текст или слово, которые будут являться ссылкой на номер телефона.
• Нажмите на кнопку «Вставить/редактировать ссылку» в текстовом редакторе.
• В поле URL введите «tel:номер_телефона», где номер_телефона — это номер телефона, который вы хотите сделать кликабельным. Например, «tel:+79123456789».
• Нажмите кнопку «Применить».

1. Использовать плагин для создания кликабельных телефонных номеров, например, «Clickable Phone Numbers»:

• Зайдите в админ-панель WordPress и перейдите в раздел «Плагины».
• Нажмите на кнопку «Добавить новый».
• Введите «Clickable Phone Numbers» в строке поиска и нажмите кнопку «Найти плагины».
• Найдите плагин «Clickable Phone Numbers» и установите его.
• Активируйте плагин.
• Теперь все телефонные номера на вашем сайте будут автоматически сделаны кликабельными.

1. Использовать HTML-код:

• Откройте страницу или запись, где нужно добавить кликабельный номер телефона.
• Вставьте следующий HTML-код: номер_телефона, где номер_телефона — это номер телефона, который вы хотите сделать кликабельным. Например, +7 (912) 345-67-89.
• Сохраните страницу или запись.

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

Как добавить кликабельные номера телефонов для смартфонов в WordPress

Количество пользователей, которые посещают сайты со своих смартфонов, ежедневно увеличивается. Множество предприятий размещает свои телефонные номера на своих сайтах, однако эти номера не кликабельны. Недавно, один из наших читателей, который работал над сайтом ресторана, спросил, существует ли способ превратить телефонные номера в кликабельные ссылки для «мобильных» пользователей. Это бы позволило части аудитории просто нажать на экран и позвонить в ресторан прямо с сайта. В сегодняшней статье мы покажем вам как добавить кликабельные телефонные номера для смартфонов в WordPress.

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

Правильный формат для указания телефона следующий:

Например: +1 (555) 555-1212

Однако, большинство смартфонов распознаю и такие вариации:

• +15555551212
• +1.555.555.1212
• 555-555-1212
• 555 555 1212

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

 +1 (555) 555-1212 Позвонить мне 

Проблема со ссылке выше в том, что она будет видна для пользователей на всех устройствах. Если кто-то на ПК кликнет по ней, то в Google Chrome ничего не произойдет, а в Firefox отобразится ошибка.

В этом примере мы применили протокол callto:. Этот протокол используется Skype наряду с skype:. Такой способ имеет преимущество в том, что пользователи со смартфонов смогут позвонить по номер, используя телефонию, в то время как пользователи на десктопах и других устройствах смогут совершить звонок с помощью Skype.

Пример выше связывает изображение с номером, используя протокол Skype callto: Проблема в таком синтаксисе в том, что смартфон может распознать протокол Skype, но может не справится с телефонным номером. Более того, мобильная ОС может и вовсе не предложить выбор для совершения звонка.

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

Мы надеемся, что эта статья помогла вам добавить кликабельные номера телефонов для смартфонов в WordPress.

По всем вопросам и отзывам просьба писать в комментарии ниже.

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

Как сделать кликабельный номер телефона на сайте

Когда пользователь может в один клик по номеру телефона сделать звонок, это в плюс и ему, и вам. Он тратит минимум усилий и времени, чтобы вам дозвониться, а вы получаете +1 целевой звонок. Естественно, это относится к мобильным устройствам.

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

HTML-код

Обычный номер телефона, который пока является простым текстом, в коде может выглядеть так:
+7(999)888-77-66
Или так (если присвоен класс):

Или так (если к этому тексту применены стили: цвет, шрифт, форматирование):

За гипертекст (возможность текста в коде HTML включать в себя гиперссылку) отвечает тег . . Атрибут href=”” отвечает за то, куда будет направлен клиент — внутри кавычек указывается адрес страницы или действие.

За автоматический набор номера по клику отвечает параметр tel:ХХХ, где XXX — номер телефона без пробелов и тире.

Таким образом, для первого примера код будет следующим:
К тексту добавили действие – вызов на конкретный номер.
Сделаем и второй номер кликабельным:

Третий пример тоже без особых усилий становится гипертекстом. При этом сохраняются его изначальные стили:

По этому же принципу вы можете сделать кликабельный email.

Сайт на WordPress

Для Вордпресса есть специальный плагин CallPhone’r. Этот модуль выводит на каждой странице сайта иконку, при нажатии на которую мобильное устройство переходит в режим вызова.

Там же есть возможность настройки по времени отображения иконки. Это позволит не получать звонки от клиентов в нерабочее время.

Сайт на mottor (LPmotor)

Этот конструктор дает несколько вариантов.
1) Телефон в виде текста.

В этом случае выделите текст телефона в блоке и нажмите кнопку добавления ссылки в панели редактирования:

2) Переход к набору номера с кнопки. В панели редактирования блока «Кнопка» необходимо выставить «Переход по ссылке» и указать ваш номер телефона в формате «tel:88005555555».

3) Переход к набору номера с иконки/картинки. Здесь в выпадающем меню «Действие» нужно выбрать «Переход по ссылке» и вставить номер в формате «tel:+74957873422».

4) Также можно вставить кликабельный телефон на сайт в виде html блока.
Тогда в поле «Редактирование HTML-кода» нужно вставить

Сайт на Wix

1) Чтобы создать кликабельный номер телефона:
— Добавьте текст. Вот инструкция из базы знаний Wix о том, как это сделать;
— Нажмите «Редактировать текст»;
— Введите номер телефона. Не вводите другой текст в том же окне.
2) Чтобы связать текст ссылкой с номером телефона:
— Добавьте текст;
— Нажмите «Редактировать текст»;
— Введите текст, например, «Позвонить сейчас»;
— Выделите текст;
— Нажмите на иконку «Ссылка»;
— Выберите Номер телефона;
— Введите номер телефона в поле «Номер телефона»;
— Нажмите «Готово».
3) Чтобы связать кнопку ссылкой с номером телефона:
— Добавьте кнопку
— Измените текст кнопки
— Нажмите на иконку Ссылка
— Выберите Номер телефона
— Введите номер телефона в поле «Номер телефона»
— Нажмите «Готово».

Сайт на Tilda

Чтобы при клике на номер телефона начинался звонок или при клике на e-mail открывался почтовый клиент, нужно навесить на них ссылки.

1) Ссылка, которую нужно задать тексту с номером телефона: tel:+71234567890 (все без пробела). Будет работать при просмотре сайта на телефоне.

Например, выбираете блок меню ME301, во вкладке Контент в поле Дополнительно указываете номер телефона, затем выделяете его и с помощью выпадающей панели инструментов для текста добавляете ссылку вида tel:+7123456789.

2) Ссылка, которую нужно задать тексту с адресом почты: yourmail@mysite.com. При добавлении ссылки в Контент блока в поле «Ссылка», нужно указывать ссылку как mailto:yourmail@mysite.com.

Как отслеживать клики по номеру телефона

Это можно делать без вмешательства в код и установки Менеджера тегов Google. В Яндекс.Метрике не так давно появился новый тип цели – «Клик по номеру телефона». Достаточно указать нужные параметры, и данные о звонках будут поступать в Метрику:

Чтобы всё работало, важно указать номер в точности такой же, какой указан в коде сайта. Лучше всего скопировать адрес ссылки прямо с сайта. Для этого:

• Кликните правой кнопкой мыши по номеру на сайте и нажмите в меню «Просмотреть код»;
• В открывшейся консоли разработчика вы увидите нужную ссылку с номером;

• Скопируйте её и вставьте в параметрах цели.

Данные по кликам на номер телефона появятся в отчете «Конверсии» уже через несколько минут после создания цели.

Похожие статьи

Хотите тоже написать статью для читателей Yagla? Если вам есть что рассказать про маркетинг, аналитику, бизнес, управление, карьеру для новичков, маркетологов и предпринимателей. Тогда заведите себе блог на Yagla прямо сейчас и пишите статьи. Это бесплатно и просто

Опубликовано редакцией Yagla
Читайте ещё статьи по этой теме

Маркетинговый анализ аудитории перед созданием продающего контента Статья

Привет, друзья!Меня зовут Надежда Богданова, я копирайтер-маркетолог, специалист по текстам для лендингов. Еще весной обещала рассказать, как я это делаю…Речь про маркетинговое исследование и анализ для создания продающих текстов. 2

Как оптимизировать контекстную рекламу: главные точки роста Статья

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

Сегментация трафика в Яндекс.Директе: практическое руководство Статья

Когда пользователь видит в объявлении ответ на свой запрос (на поиске) или что-то, что его может заинтересовать (в сетях), высока вероятность, что он перейдет на сайт и всё закончится конверсией. С общими посылами, рассчитанными на широкую аудиторию, это не работает.