PortaPhone Web Widget configuration

You must have an active subscription to the PortaPhone module and have PortaPhone deployed.

Once your free trial/paid subscription is activated, you can deploy your branded PortaPhone Web Widget:

• Preparation steps
• Module configuration and deployment

Before proceeding with the module configuration and deployment, perform the following steps:

1. Configure a domain
2. Prepare a logo and a favicon

You need to configure a domain, e.g., widget.your-domain-name.com. It will not be visible to your customers and is only required to deploy the web widget module in our Add-on Mart cloud infrastructure.

For your branded widget, prepare a logo. The format of the logo: .svg, .png, .jpg.

It is crucial that the logo has a transparent background.

Once the module is activated and the preparation steps are performed, you can customize and deploy your PortaPhone Web Widget.

On the My modules page, choose the module, and click Configure.

On the Configuration UI that opens, fill in the configuration details and click Deploy (or Save for later to deploy it later).

The Configuration UI includes the following sections:

• General settings
• Your widget branding
• Click-to-dial configuration
• Domain configuration
• PortaPhone connection configuration

Select the location that is closest to your PortaSwitch and the suitable widget version:

• Instance location – select the cloud datacenter closest to your PortaSwitch from where the widget will be deployed (to minimize the latency). If none of the locations are close enough, please contact the PortaOne sales team. Additional data centers in other locations can be activated upon request.
• PortaPhone Web Widget Version – by default, the latest available PortaPhone Web Widget version is set. You can also select another version from the list.

Upload your logo to brand your web widget.

• Company logo – upload your logo that will be shown on the application web page instead of the default one.
• The pattern of client-side URL(s) to hide the widget at – configure whether to hide the widget on certain pages of your web application. For example, if you enter the pattern (/sign-in)|(/login), the widget will automatically hide on any page whose URL contains /sign-in or /login. So, if your website is https://portal.example.com, the widget is hidden on:
  • https://portal.example.com/sign-in
  • https://portal.example.com/login
  • https://portal.example.com/login/reset

and the widget is visible on any other page, such as:

• • https://portal.example.com/dashboard
  • https://portal.example.com/products
  • https://portal.example.com/about

Choose whether you want to enable click-to-dial functionality for the users:

• Enable Click-to-dial functionality – select Yes to make phone numbers in the host application clickable. When enabled, clicking a number will automatically start a call via the widget.
• Click-to-dial default country – this setting defines a default country used to validate phone numbers detected in the host application. You enter a two-letter country code (ISO 3166-1 alpha-2), e.g., US for the United States, so if the default country is the US and a host application displays 555-1234 number, then the widget interprets it as +1 555-1234 valid US number. Phone numbers in the host application may be written in local formats (without country codes or in regional styles). Without a default country, the widget might fail to recognize local-format numbers correctly. 

• Widget domain – specify the domain configured at step 1.

Fill in the parameters that are needed to connect the widget to PortaPhone.

• User API URL – define the URL of the PortaPhone application: https://<your PortaPhone domain>/api/v1, e.g., https://core.demo2.portaone.com/api/v1
• Signaling protocol URL – specify the URL where the web application will establish a Websocket connection to receive real-time updates on call state changes and session closures: https://<your PortaSwitch domain>/signaling/v1, e.g., https://core.demo2.portaone.com/api/v1

To deploy your PortaPhone Web Widget right away, click Deploy.

To save the configuration and deploy it later, click Save for later.

Once the PortaPhone Web Widget is successfully deployed, open the link to the web application where the widget is embedded, sign in with your credentials, and test the functionality.