Customize InstaCall

OnSIP InstaCall allows your website visitors to call you with the click of a button. InstaCall uses WebRTC to provide rich, context-based communications. OnSIP’s development platform provides you with several tools for customizing and even white labeling InstaCall for your application. You can create any number of InstaCall buttons, each configured to call to a specific predetermined destination.

How It Works

OnSIP InstaCall consists of two parts: the InstaCall button and the popup phone window. Inserting the InstaCall button on a web page allows visitors to see it. Once a visitor clicks the button, they are presented with the phone window, allowing them to place a call instantly to the configured address.

The InstaCall Button

The InstaCall button is a snippet of HTML code that can be pasted into any web page. While fully customized InstaCall buttons are quite complex, the simplest InstaCall button isn’t actually that complicated:

1
2
<button class="ic-button" data-address="welcome@junctionnetworks.com" disabled>Click to Call</button>
<script src="http://insta.onsip.com/call/js/popup.js"></script>

InstaCall uses an HTML <button> to provide a clickable interface. The button stores configuration options as attributes prefixed with data-. A <script> is inserted which parses the configuration options of the InstaCall button, detects browser support for WebRTC, enables the button, and adds the behavior to pop open the InstaCall window when the button is clicked. The Advanced Customization guide contains a full list of configuration options.

The InstaCall Window

The InstaCall phone window allows a website visitor to place a call to the preconfigured destination SIP address. Using SIP.js, InstaCall creates a SIP user agent and presents the visitor with options to place a call. Several components, such as video calling, a name prompt, a number pad, and even the CSS theming are controlled by configuration options passed between the InstaCall button and the InstaCall window via URL query parameters.

Basic and Advanced Customization

OnSIP provides two levels of customization for InstaCalls. For basic customizations, an Admin API call is provided to generate button codes. For more advanced customizations, the full source code of InstaCall is provided on Github. Check out the following guides to learn more about customizing InstaCall buttons:

Topics: Developer Docs