How to Add Telephone Links with HTML? click to call action in HTML

0 3248

In this tutorial, I will show you how to add telephone links on the webpage using HTML?

Nowadays, web browsing is increasing exponentially. For responsive websites, users expect click-to-call buttons and often look for these within the webpage. With this tutorial, I will demonstrate adding a telephone link with HTML.

This can be achieved with very simple steps. I am using link tag <a> along with the attribute href.

Syntax:

<a href="tel"> Click To Call </a>

When you click on this link in the mobile device. You will be redirected to the dial pad of the mobile devices to call clickable numbers.

Code:

<!DOCTYPE html>
<html>
 <head>
    <title> Adding a telephone link </title>
    <style>
    .mid
    {
     width: 30%;
margin: 0px auto;
font-family: Verdana,Geneva,sans-serif;

    }
    .mid h1
     {
      font-family: Verdana,Geneva,sans-serif;
      font-size: 17px;

     }
    </style>
  </head>
  <body>

    <div class="mid">
    <h1> Adding a telephone link </h1>
     <br>
    <a href="tel:+912222221111"> Call on +912222221111 </a>
    </div>
  </body>
</html>

Execute

Output: