Advanced WebRTC Button Customization

For those looking for more advanced customization options of the WebRTC button, here is the full source code for our WebRTC button, InstaCall, on GitHub. Feel free to fork the repository, as well as submit pull requests with any suggested improvements.

HTML Data Parameters

Once forked from the GitHub repository, adding parameters to InstaCall will break compatibility with the InstaCall Generate Admin API action. Extra parameters should be defined on the InstaCall button as attributes prefixed with data- to allow JavaScript easy access to the option. A full listing of existing options appears below. Note that some of these options are experimental and not configurable through the InstaCall Generate action alone.

Style Parameters

ParameterDescriptionDefault Value
data-theme CSS theming for button flat-light
data-removelogo Hide or show the OnSIP logo false
data-display If “sidebar”, append the phone window in an iFrame  

Call Parameters

ParameterDescriptionDefault Value
data-address The SIP address to invite  
data-fromuri SIP From header URI anonymous.123456@anonymous.invalid
data-video Enable or disable video true
data-dtmf Enable of disable DTMF true

Caller ID Parameters

ParameterDescriptionDefault Value
data-callerid One of instacall-name, caller-name, or caller-name-tag instacall-name
data-instacallname Unique name for the InstaCall button  
data-calleridtag A tag to be prepended to the caller name, if data-callerid is “caller-name-tag”  

Text Parameters

ParameterDescriptionDefault Value
HTML inside <button> The button text “Click to Call”
data-altphone An alternate phone number  
data-altwebsite An alternate web site  
data-altemail An alternate contact email  
data-instructions Message to display before visitor places call. “Start your call with us.”
data-postmessage Message to display after a successful call ends. “Thank you for getting in touch with us!”

Analytics Parameters

data-analyticswebpropertyid Google Analytics Web Property ID
data-analyticsdomainname Google Analytics domain name

BHR Parameters

Business Hour Rules allow the InstaCall button to be enabled only during certain hours. There are separate business hour rules for open and close times each day of the week.

ParameterDescriptionDefault Value
data-bhr0open Open time for Sunday “0000”
data-bhr1open Open time for Monday “0000”
data-bhr6open Open time for Saturday “0000”
data-bhr0close Closing time for Sunday “2359”
data-bhr1close Closing time for Monday “2359”
data-bhr6close Closing time for Saturday “2359”
data-timezone Hours offset for Business hour rules 0

Topics: Developer Docs