Step 1: Paste Speebly Script Into Your Webpage

Paste the script

Cut and paste the below on an SSL enabled page or footer (HTTPS) and the Speebly voice assistant will show up on your page.

IMPORTANT: If the voice client is not on an HTTPS page, it will not work for your end users.

<script src="https://voice.speebly.co/live/speably-widget.js"></script>
<script>
  SpeablyWidget.mount({
  dialogFlowAccessToken: '6cb4d7442eb94f889ec4b068fce59494',
  buttonVisible: true,
  language: 'en-US',
  voiceId: 'Joanna',
  mode: 'voice',
  });
</script>

Connect/ Configure Dialog Flow

Now that you have a default voice agent on your site, you will want to change what it says and does. For this, follow the instructions in Step 2

Sign-up for a free online training session to get up and running fast

We will send a meeting invite to confirm the webinar details.

(Advanced and optional) How to add the voice feature behind any button you choose

With the following code, you can also open the voice client from any button you choose. In the script below, a button opens the widget, but it can be anything you like.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Speably Widget</title>
    <meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=0">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    </head>
  <style>

    .button {
        background-color: #000000; 
        text-align: center;
        font-size: 60px;
        position:fixed;
        width:80px;
        height:80px;
        bottom:30px;
        right:30px;
        color:#FFF;
        border-radius: 100%;
    }
    
    </style>
    </head>
    <body>
    
    <div class="bg"></div>
    
    <script src="https://voice.speebly.co/live/speably-widget.js"></script> 
    <script>
        SpeablyWidget.mount({
            debug: true,
            buttonVisible: false,
            dialogFlowAccessToken: '8d73e9b3b6a143b5b232ed6792712c32',
            language: 'en-US',
            voiceId: 'Joanna',
            mode: 'voice',
        });
    
      function openWidget(){
          SpeablyWidget.open();
        }
    
    </script>
    
    <button onclick="openWidget()" class="button"><i class="fa fa-question"></i></button>
    
    </body>
</html>