Количество пользователей, которые посещают сайты со своих смартфонов, ежедневно увеличивается. Множество предприятий размещает свои телефонные номера на своих сайтах, однако эти номера не кликабельны. Недавно, один из наших читателей, который работал над сайтом ресторана, спросил, существует ли способ превратить телефонные номера в кликабельные ссылки для «мобильных» пользователей. Это бы позволило части аудитории просто нажать на экран и позвонить в ресторан прямо с сайта. В сегодняшней статье мы покажем вам как добавить кликабельные телефонные номера для смартфонов в WordPress.
Если телефон написан в формате, который телефон может распознать, тогда смартфон автоматически превратит его в ссылку. Однако, если вы хотите, чтобы номер был заменен на текст анкора, или же чтобы номер телефона был в виде картинки, тогда ссылку придется создавать вручную.
Правильный формат для указания телефона следующий:
Например: +1 (555) 555-1212
Однако, большинство смартфонов распознаю и такие вариации:
Как сделать активные ссылки на телефон, S скайп, @ емайл. tel, skype, mailto. HTML5. Уроки.
- +15555551212
- +1.555.555.1212
- 555-555-1212
- 555 555 1212
![phone-number-link[1]](https://wpincode.com/wp-content/uploads/2016/03/phone-number-link1.jpg)
Если указывать номера телефонов в правильном формате, то они автоматически будут превращаться в ссылки для пользователей со смартфонами. Однако же, пользователи со старыми телефонами могут не увидеть ссылку.
+1 (555) 555-1212 Позвонить мне
Проблема со ссылке выше в том, что она будет видна для пользователей на всех устройствах. Если кто-то на ПК кликнет по ней, то в Google Chrome ничего не произойдет, а в Firefox отобразится ошибка.
В этом примере мы применили протокол callto:. Этот протокол используется Skype наряду с skype:. Такой способ имеет преимущество в том, что пользователи со смартфонов смогут позвонить по номер, используя телефонию, в то время как пользователи на десктопах и других устройствах смогут совершить звонок с помощью Skype.
Пример выше связывает изображение с номером, используя протокол Skype callto: Проблема в таком синтаксисе в том, что смартфон может распознать протокол Skype, но может не справится с телефонным номером. Более того, мобильная ОС может и вовсе не предложить выбор для совершения звонка.
Также вы можете создавать ссылки с именами пользователей Skype и предоставлять поддержку в чате, или же голосовую поддержку для своих посетителей.
Как в ВК сделать ссылку на номер телефона
Когда создаешь сайт, часто бывает удобно, чтобы ссылка на номер телефона переходила сразу к набору номера. То же самое относится и к email. На ВКонтакте также есть возможность создавать ссылки на контакты и профили, что может быть полезно, например, при добавлении контактов на страницу бизнеса.
Как сделать ссылку на номер телефона
Ссылка на номер телефона может понадобиться, чтобы пользователи могли одним кликом сделать звонок. Для этого нужно создать ссылку, при клике на которую запустится приложение для набора номера. Чтобы сделать ссылку на телефонный номер на ВКонтакте, выполните следующие действия:
Как Сделать Ссылку на Беседу в ВК с Телефона в 2022
- Вставьте атрибут `href`, который указывает на ссылку:
- Добавьте параметр `tel:` после `href`, а затем введите номер телефона в международном формате, начиная с плюса, без пробелов и тире:
- Добавьте текст, который будет отображаться на странице:
Теперь при клике на ссылку, пользователь сможет набрать номер телефона.
Как дать ссылку на свой профиль ВКонтакте
Для того, чтобы дать ссылку на свой профиль на ВКонтакте, выполните следующие действия:
- Кликните на раздел «Моя страница» в боковом меню.
- Нажмите кнопку «Ссылка на профиль» или скопируйте ссылку из адресной строки браузера.
- Чтобы скопировать ссылку, щелкните правой кнопкой мыши по ссылке и выберите в меню пункт “Копировать”.
Также можно дать ссылку на свою страницу в ВКонтакте, добавив свою фамилию и имя к базовому URL профиля. Например, ссылка будет выглядеть так:
https://vk.com/first.last
где `first` и `last` — это ваша фамилия и имя соответственно.
Как сделать ссылку на пользователя в ВКонтакте
Чтобы создать ссылку на пользователя, сообщество или любой другой объект ВКонтакте, нужно ввести символ «*» и после него короткое имя пользователя, id или ссылку на материал внутри ВКонтакте. Например, чтобы сделать ссылку на профиль пользователя с id 123, нужно написать:
https://vk.com/id123
Чтобы ссылка на сообщество работала, вместо `id` нужно использовать `club`. Например, для сообщества с id 456 ссылка будет выглядеть так:
Как оформить ссылку на ВКонтакте
Чтобы оформить внутренние ссылки ВКонтакте, есть два способа:
- Введите `[]`, укажите нужную ссылку, затем разделите ссылку и текст значком `|`, и впишите `]`.
[ссылка на страницу в ВКонтакте | https://vk.com/page123]
Полезные советы
- Убедитесь, что в вашем номере телефона используется международный формат.
- Чтобы избежать ошибок при вводе номера телефона, можно использовать JavaScript, чтобы автоматически добавлять пробелы и тире в номер.
- Если вы измените имя пользователя или сообщества, то ссылка на них также изменится.
- Если на страницу перешел пользователь, который не является зарегистрированным пользователем ВКонтакте, то ему может быть предложено зарегистрироваться.
- Помните, что ссылка на профиль может быть видна всем, так что давайте ссылку только тем, кому вы хотите ее дать.
Выводы
Сделать ссылку на номер телефона, email или профиль на ВКонтакте несложно, а благодаря этим ссылкам связаться с вами станет гораздо проще для ваших пользователей. Надеемся, что наши советы помогут вам создавать качественный контент на вашем сайте и в социальных сетях.
Как сделать ссылку на номер телефона
Сейчас на сайтах все чаще употребляются кликабельные номера телефонов, которые позволяют пользователям совершать звонки по клику на них. Но как именно сделать такую ссылку? Для этого нужно создать тег, который будет обозначать номер телефона. Внутри тега, вместо троеточия, необходимо вставить атрибут href=«», который будет отвечать за ссылку.
В кавычках этого атрибута нужно ввести параметр tel: и после двоеточия — номер в международном формате, с знаком плюс перед ним и без пробелов и тире. Таким образом, при клике на телефонный номер, пользователь будет переадресован на страницу с набором этого номера. Это удобно для многих пользователей, которые могут быстро связаться с администрацией сайта или компании.
Как сделать ссылку на звонок в ВК
Для того чтобы сделать ссылку на звонок в социальной сети ВКонтакте, необходимо выполнить несколько простых действий. Сначала зайдите в настройки своей страницы и найдите пункт «Адрес страницы». Далее, вызвав режим изменения, вы увидите номер страницы, который является ее идентификатором.
Для создания ссылки на звонок, следуйте формату: https://vk.com/away.php?to=звонокhttps://svyazin.ru/vks/kak-v-vk-sdelat-ssylku-na-nomer-telefona» target=»_blank»]svyazin.ru[/mask_link]
Номер телефона на сайте
В последнее время нельзя пренебрегать кликабельными номерами телефонов т.к. количество клиентов, использующих мобильные телефоны превысило десктопы. И чтобы не потерять своего клиента, необходимо предоставить посетителю возможность беспрепятственно позвонить.
Оформление ссылки tel
По умолчанию на мобильных телефонах номера телефона распознается автоматически и преобразуются в ссылки.
До:
После:
Чтобы задать нормальные стили на мобильных, нужно писать два правила.
.phone < color: #000; font-size: 16px; font-weight: 900; >.phone a
Или по атрибуту:
a[href^=»tel:»]
Отключить распознавание телефонов
Автоматическое распознавание телефонов работает не всегда корректно и срабатывает на большие цены. Его можно отключить, добавив метатег в страницы и прописать ссылки у телефонов вручную.
Оборачивание телефонов ссылками
Замечена одна особенность – на андроид устройствах не всегда срабатывает клик по ссылке если в атрибуте href форматированный номер телефона.
+7 (495) 123-45-67 +7 (495) 123-45-67
Обвернуть телефон регулярным выражением
Если телефонов много, то лучше автоматизировать замену с помощью регулярного выражения.
function replace_phone_call($matches) < $tel = str_replace(array(‘-‘, ‘ ‘, ‘(‘ , ‘)’), », $matches[0]); $tel = str_replace(‘+7’, ‘8’, $tel); return » . $matches[0] . »; > function replace_phone($text) < return preg_replace_callback(‘/(?:+|d)[d-() ]d/’, ‘replace_phone_call’, $text); > $text = ‘Позвоните по телефону +7 (495) 123-45-67, или 88001234567’; echo replace_phone($text);
Результат:
Позвоните по телефону +7 (495) 123-45-67, или 88001234567
Также можно добавить проверку мобильных с помощью mobiledetect и на десктопе ссылки не выводить.
require_once ‘Mobile_Detect.php’; $detect = new Mobile_Detect; define(‘IS_MOBILE’, $detect->isMobile() !$detect->isTablet()); function replace_phone_call($matches) < $tel = str_replace(array(‘-‘, ‘ ‘, ‘(‘ , ‘)’), », $matches[0]); $tel = str_replace(‘+7’, ‘8’, $tel); return » . $matches[0] . »; > function replace_phone($text) < if (IS_MOBILE) < return preg_replace_callback(‘/(?:+|d)[d-() ]d/’, ‘replace_phone_call’, $text); > else < return $text; >> $text = ‘Позвоните по телефону +7 (495) 123-45-67, или 88001234567’; echo replace_phone($text);
Или сделать на мобильных ссылку с номером телефона, а на десктопе ссылку на форму обратного звонка.
require_once ‘Mobile_Detect.php’; $detect = new Mobile_Detect; define(‘IS_MOBILE’, $detect->isMobile() !$detect->isTablet()); function replace_phone_call($matches) < if (IS_MOBILE) < $tel = str_replace(array(‘-‘, ‘ ‘, ‘(‘ , ‘)’), », $matches[0]); $tel = str_replace(‘+7’, ‘8’, $tel); return » . $matches[0] . »; > else < return » . $matches[0] . »; > > function replace_phone($text) < return preg_replace_callback(‘/(?:+|d)[d-() ]d/’, ‘replace_phone_call’, $text); > $text = ‘Позвоните по телефону +7 (495) 123-45-67, или 88001234567’; echo replace_phone($text);
Результат на десктопе и планшетах:
Позвоните по телефону +7 (495) 123-45-67, или 88001234567
На мобильных:
Позвоните по телефону +7 (495) 123-45-67, или 88001234567
Источник: snipp.ru