The topic of this article is simple and nice. We just summarize the options of creating telephone links, or if you prefer “clickable phone numbers”. Today, some of the mobile applications are implemented not as native, but as web apps, and there is often a need to create a link to a phone call (call the user), or send SMS, or call via Skype.
HTML5: make clickable phone number simply
Also on “regular” websites, where we show contact data, it is good (from the user and UX points of view) to make phone number clickable. The user can very easy call the number then (no copy-paste and so on). A phone call needed, or maybe SMS, or Skype call? No problem. HTML5 brings an easy way to create links to phone calls, sms, e-mail…
How to?
Very easy. Simply use the ‘href’ attribute of the link, but with the tel: string, after which put a valid phone number (or skype user name). A few examples below.
A basic clickable phone number:
<a href="tel://+1234567890">Call Me</a>
or:
<a href="tel:123-456-7890">123-456-7890</a>
Skype (a number or username):
<a href="skype:+1234567890?call">Call Me</a> <a href="skype:user_name?call">Call Me </a>
More universal (callto):
<a href="callto://+1234567890">Call Me</a>
Clickable image (like telephone icon etc) is also very simple to do:
<a href="skype:user_name?call"><img src="/images/call.png"></a>
So the href parameter can deal with following options:
tel: (phone)
callto: (Skype)
sms: (text message)
fax:
Resources
https://davidwalsh.name/phone-link-protocol
net investment income tax . cheats for Valorant
https://developers.google.com/web/fundamentals/native-hardware/click-to-call
Ruby on Rails
If you are RoR programmer, maybe you’ll need a simple helper, that creates clickable links. An example below.
# Renders telephone number as click-able link.
# Types:
# tel:, callto:, sms:, fax:
#
# Samples:
# <a href="tel:123-456-7890">123-456-7890</a>
# <a href="tel://+1234567890">Call</a>
# <a href="skype:+1234567890?call">Call</a>
# <a href="callto://+1234567890">Call</a>
# <a href="skype:username?call">Call</a>
def clickable_phone_number(phone_number)
# ret = link_to phone_number, "skype:#{phone_number}"
ret = link_to phone_number, "tel:#{phone_number}"
ret
end
More examples for Rails:
https://stackoverflow.com/questions/38821059/what-is-the-rails-way-equivalent-of-mailto-and-tel
http://tammersaleh.com/posts/easy-iphone-telephone-links-in-rails
https://github.com/swordray/tel_to_helper
Summary
Thus, we have in one place quite a complete list of options, that we need when we want to create clickable phone numbers, open telephony or text messages, Skype, or simply e-mail. Have fun!
Posted in 
Tags: 
