Set up WebRTC Click-to-Call

WebRTC click-to-call lets visitors ring your company straight from their browser, with no dialer or app to install. WebRTC (Web Real-Time Communication) is the technology built into modern browsers that carries voice and video without any plugin. You set it up in two moves: create a WebRTC trunk (the connection that carries these browser calls into your phone system) to obtain a call link, then place that link behind a button or embed it in a page. This guide walks through building the trunk, routing its inbound calls to the right destination, testing the flow, and adding the link to your site.

Before you begin

• Video calling is available only on the Ultimate Plan. Voice-only click-to-call works on any plan.
• Cloud Voice must be running version 84.11.0.22 or later.
• You need permission to add trunks. Building a WebRTC trunk starts with the Add button under Extension and Trunk > Trunk.

Note

If the Add button on Extension and Trunk > Trunk is greyed out, your account cannot add trunks. Contact your service provider to have the permission enabled.

Step 1: Create the WebRTC trunk

The trunk is what generates the call link your visitors will use.

1. Sign in to the PBX (Private Branch Exchange, the phone system that connects your extensions and outside lines) web portal and go to Extension and Trunk > Trunk, then click Add.

2. Under Basic, fill in these fields:

   • Name: A label that makes the trunk easy to recognize later.
   • Trunk Status: Set to Enabled.
   • Select ITSP Template: Choose General. ITSP stands for Internet Telephony Service Provider; the template pre-loads common trunk settings, and General is the correct choice for a WebRTC trunk.

   

3. Under Detailed Configuration, set:

   • Trunk Type: Select WebRTC Trunk.
   • Username: Enter a username for the trunk.

   

4. (Optional) Open the Advanced tab to fine-tune the trunk:

   • Under Codec Settings, pick the codecs you want to use.
   • Under Call Restriction, cap the number of simultaneous calls the trunk will carry.

   Note

   The concurrent-call limit sets how many WebRTC calls the trunk can carry at the same time. It defaults to 5 and can be raised to a maximum of 10. Once the trunk reaches its limit, further click-to-call attempts are turned away until a call ends, so size it for your busiest expected traffic.

5. Click Save, then Apply.

Once saved, the trunk appears in the list with a green status indicator, and its WebRTC Inbound Call Link is generated in the trunk’s detail view.

Step 2: Route the WebRTC inbound calls

Add an inbound route so calls that arrive through the WebRTC trunk land where you want them.

1. Go to Call Control > Inbound Route and click Add.

2. Under General, give the route a name.

   

3. Under Trunk, move the WebRTC trunk from the Available box to the Selected box.

   Caution

   An inbound route cannot mix trunk types. If you select the WebRTC trunk, you cannot also add a trunk of any other type to the same route.

4. Under Default Destination, decide where the calls go:

   • Same destination every time: Pick it from the Default Destination drop-down list.

     

   • Different destinations by time of day:

     1. Select the Time Condition checkbox.
     2. Choose a mode from the Time-based Routing Mode drop-down list.
     3. Set a destination for each time period.

     For examples of time-based routing, see Route inbound calls based on Business Hours, Route inbound calls based on Department Hours, and Route inbound calls based on Employee Hours.

5. Click Save, then Apply.

Step 3: Test the click-to-call flow

Confirm that a call through the link reaches the destination you configured.

1. Go to Extension and Trunk > Trunk and click the edit icon next to the WebRTC trunk.

2. Under Detailed Configuration, copy the WebRTC Inbound Call Link.

   

3. Paste the link into a new browser tab’s address bar and press Enter.

A dialpad opens in the browser and a call is placed to the destination you set.

Tip

While on the call, click the video icon in the lower-left corner of the page to switch to a video call.

Add the link to your website

With the call link working, embed it in your site one of two ways.

Option 1, Link a button you build. Create your own call button and point its link to the WebRTC inbound call link.

Option 2, Use the built-in button template. The WebRTC trunk also provides a ready-made call button. Reference its embed link with a script tag:

<script src="{Default Call Template Embed Link}"></script>

Note

Find the Default Call Template Embed Link in the trunk’s Detailed Configuration view, in the same place as the WebRTC Inbound Call Link. Copy it into the src attribute above.

The result is a call button that opens the dialer when a visitor clicks it: