Warning: include_once(analyticstracking.php): failed to open stream: No such file or directory in /home/lauren716/public_html/wp-content/themes/v1voip/header.php on line 67

Warning: include_once(): Failed opening 'analyticstracking.php' for inclusion (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/lauren716/public_html/wp-content/themes/v1voip/header.php on line 67

Blog Posts

Add a WebRTC Button to Your Facebook Page (Part 1)

Posted on: December 17, 2020

It’s common for B2B companies to have profiles on popular social media websites, such as Facebook, Twitter, and LinkedIn. Maintaining a presence on these networks gives customers and potential customers more ways to connect and interact with your company. At OnSIP, we like to use our social media profiles to post recent blog posts, customer interviews, phone reviews, and other relevant news.

If you visit the OnSIP Hosted PBX page on Facebook, you’ll see that we have a custom tab called “InstaCall Now”. If you go to that page, you’ll see a call to action: “InstaCall a member of the OnSIP team!” You can select one of four OnSIP team members to call from a drop-down menu: Rob Wolpov, Mike Oeth, Tim Cleves, or Nicole Hayward.

OnSIP Hosted PBX Facebook Page InstaCall Demo

Once you select a name and hit “Click to Call Now!”, a pop-up window will appear, asking you to enter your full name and select a voice or video call.

OnSIP InstaCall Popup

By typing in your name and clicking one of the two buttons, you will initiate a free call via WebRTC to the OnSIP team member you selected. Try it out!

How to Create a WebRTC Button with a Drop-Down Menu

This cool demo is actually a WebRTC button on a custom Page Tab created using Facebook’s developer tools. With a bit of HTML and Javascript, you can create your own custom WebRTC button on your company’s Facebook page. In this first post, we’ll go over how to create a custom WebRTC button with a drop-down menu using the OnSIP Admin Portal. In our second post, we’ll cover how to create a custom Facebook Page Tab and add it to your company page.

1. Create an InstaCall button in the OnSIP Admin Portal

To create an InstaCall button, log in to the OnSIP Admin Portal. Go to the Apps page, then click on “Create New Apps” and select “InstaCall”.

Now you can set some basic parameters for your InstaCall button. Choose a name, like “Facebook” and set the call destination to yourself, or whoever will be answering the InstaCalls (if you want a drop-down menu, select a random destination for now). There are options to enable video and dialpad; enter alternative contact methods; select caller ID options; select a time zone; set Business Hour Rules; and track activity with Google Analytics. On the next page, you can customize the button style and text. Once you’re done configuring the InstaCall button, click “Save”.

InstaCall Button Script in the OnSIP Admin Portal

On the Apps page, you should now see your InstaCall button listed by it’s name. Click on the app to reveal the button code. If you’re only planning on sending the InstaCalls to one destination, simply copy the Javascript code in the box into the HTML webpage you want to use to display on your custom Facebook Page Tab. For more information on creating InstaCall buttons, visit our Knowledgebase article here.

2. Create a Drop-Down Menu for Your InstaCall Button

To create a drop-down menu option for your InstaCall button, you will need to edit a bit of tag:

Next, create a select menu with the SIP users you want to be able to InstaCall:

Finally, insert the following script tag below the InstaCall <button> and you copied:

Make sure that the IDs match up (“callee” for the select dropdown and “my-instacall-button” for the InstaCall button). In the end, you’ll have an HTML section that looks something like this:

In our next post, we will cover how to use Facebook’s developer tools to add a custom Page Tab to your company page to feature your new InstaCall button. In the meantime, check out some of our other posts on InstaCall: