Skip to content
Related Articles

Related Articles

How to make a call-able link using HTML ?

View Discussion
Improve Article
Save Article
  • Last Updated : 11 Oct, 2019

With the rise of mobile web surfing the benefits of calling directly from a web page have become more realistic. Making a call-able link is easy with the use of HTML. HTML provides browsers with protocols such as tel which are used to add clickable phone numbers. Every browser responds differently to these protocols. Some launch the phone app with the number on the display, waiting for you to call while others directly make the call.

Approach:

  • Add tel:(a number) inside href attribute of the anchor tag.
  • You can even add country code for international calls as a part of the number.
  • Some phone numbers have an extension. You can add p before the extension that will cause a one second delay before dialling the next phone.

Syntax:

<a href="tel:(countrycode)(NUMBER)p(extension)"> Text </a>

Example 1: This example create a call-able link using HTML.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to make a call-able
        link using HTML ?
    </title>
      
    <style>
        body {
            text-align:center;
        }
        h1 {
            color:green;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
      
    <h3>
        Make a call-able link using HTML
    </h3>
      
    <a href="tel:9876765678">
        Call to GeeksforGeeks support
    </a>
</body>
  
</html>

Output:

  • Before click on the link:
  • After click on the link:

Example 2: This example create a call-able link using HTML.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to make a call-able
        link using HTML ?
    </title>
      
    <style>
        body {
            text-align:center;
        }
        h1 {
            color:green;
        }
        a {
            text-decoration:none;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
      
    <h3>
        Make a call-able link using HTML
    </h3>
      
    <a href="tel:9876765678p107">
        📞 Help
    </a>
</body>
  
</html>

Output:

  • Before click on the link:
  • After click on the link:

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!