Pop-up

Pop-up

Opens chatbot in a pop-up window on click for advanced security requirements. This integration type will add the beacon to your website without loading any files from our CDN.

Setup

Dependencies

This type of integration has depencencies on jQuery and jQuery UI that need to be available on the website.

Files

A small set of JS and CSS needs to be added to your website.

  1. Load expert bundle:

<script src="dist/solvemate.js"></script>

  1. Include layout css:

<link type="text/css" href="dist/solvemate.css" rel="stylesheet" media="all">

Integrations

Beacon Integration

To add the beacon to a website, this code should be added within the <body> tag.

The beacon button will be displayed in the right bottom corner of the page.

<script>
    $solvemate(function() {
        $solvemate('body').chatbot({
            configUrl: 'configuration_url',
            projectId: 'your_project_id',
            type: 'beacon'
        });
    });
</script>

Open from any element

To open the Widget from any element in the website, this code should be added within the <body> tag.

<script>
    $solvemate(function() {
        $solvemate('.my-button-solvemate').chatbot({
            configUrl: 'configuration_url',
            projectId: 'your_project_id',
            type: 'inline'
        });
    });
</script>
<button class="my-button-solvemate">
    Open Pop-up Widget from button example
</button>
Open Pop-up Widget from button example

Configuration URL

configUrl in the integration script can be Solvemate API endpoint (provided by Solvemate) or you can send the requests through your own proxy so that no API calls are made to third-party systems on your website.