Set up WebRTC Click-to-Call

To implement WebRTC click-to-call, you need to create a WebRTC trunk on PBX to obtain a WebRTC call link, then embed the call link into your web page. In this way, your website visitors can make calls to your company's phone system with a click.

Prerequisites

  • You have subscribed to Enterprise Plan or Ultimate Plan.
    Note: If you need video calls, Ultimate Plan is required.
  • You have enabled the Yeastar FQDN feature (Path: System > Network > Yeastar FQDN).

Procedure

Video Tutorial

Create a WebRTC trunk

Create a WebRTC trunk to obtain a WebRTC call link.

  1. Log in to PBX web portal, go to Extension and Trunk > Trunk, then click Add.
  2. In the Basic section, complete the following settings.

    • Name: Enter a name to help you identify it.
    • Trunk Status: Select Enabled.
    • Select ITSP Template: Select General.
  3. In the Detailed Configuration section, complete the following settings.

    • Trunk Type: Select WebRTC Trunk.
    • Username: Enter a username for the trunk.
  4. Optional: Click the Advanced tab to configure advanced WebRTC trunk settings.
    1. In the Codec Settings section, configure your preferred codecs.
    2. In the Call Restriction section, set the maximum number of concurrent calls for the trunk.
      Note: The default number is 5, you can set up to 10 concurrent calls.
  5. Click Save and Apply.

    A WebRTC trunk is displayed in the trunk list with the trunk status showing ; A WebRTC call link is generated and displayed in the WebRTC Inbound Call Link field of the trunk.

Set WebRTC inbound call destination

Set up an inbound route for the WebRTC trunk to route the WebRTC inbound calls to a desired destination.
  1. Go to Call Control > Inbound Route, then click Add to add an inbound route.
  2. In the General section, set a name for the inbound route.

  3. In the Trunk section, select the WebRTC trunk from Available box to Selected box.
    Note: You can NOT select both WebRTC trunk and other types of trunk for an inbound route at the same time.
  4. In the Default Destination section, set destination(s) for the WebRTC inbound calls.
  5. Click Save and Apply.

Test WebRTC Click-to-Call

Test if the WebRTC inbound call can be routed to the given destination.

  1. Go to Extension and Trunk > Trunk, click beside the WebRTC trunk.
  2. In the Detailed Configuration section, copy the WebRTC Inbound Call Link.

  3. Open a browser tab, paste the inbound call link in the address bar, then press Enter.
    A dialpad is displayed on the web page, and a call is placed to the pre-set call destination.
    Tip: During the call, you can switch to a video call by clicking at the bottom-left corner on the web page.

What to do next

Embed the WebRTC inbound call link into your web page in either of the following ways:
  • Customize a call button on your website, and set the button link to the WebRTC call link.

  • Utilize the default call button template provided in the WebRTC trunk by referencing the embed link in your website using the following script:
    <script src="{Default Call Template Embed Link}"></script>

    The figure below shows the generated call button and the click-to-call effect: