Introduction

In wolkvox Manager, you can create a Web Chat to integrate it into your site using a script. In the standard scenario, the user fills out a form (name, phone, email, etc.), and then the chat is routed to a skill to be handled by an agent or a bot.

If your site already has this data (for example, authenticated user, previous form, your own CRM, checkout, etc.), you can integrate the widget by passing the data as variables so the customer doesn’t have to fill them out again.

Important: Each value sent in the variables must be in Base64.

Configuration

Locate the Web Chat and Open the “Integration Script”

1. In wolkvox Manager, go to “Configuration.”
2. Navigate to the “Omni Channel” section and select “WEB Chat.”
3. In the widget configuration, locate your previously created web chat widget.
4. Click on the script/integration icon (the button with the ‘</>’ icon).
5. A window called “Integration Script” will open, where you will see the standard script and the “Copy script” button.

In this window, identify the prodId value from the standard script, for example:

<!-- START CHATBOX WOLKVOX-->
<script id="prodId" type="text/javascript" src="https://widget01.wolkvox.com/chat/?prodId=a1a1a1a1" async=""></script>
<!-- END CHATBOX WOLKVOX-->

Keep the prodId and Build the Script with Variables

Use the same prodId and add the parameters txt1, txt2, etc. (according to the fields you use in your operation). Template:

<!-- START CHATBOX WOLKVOX (with variables) -->
<script id="prodId" type="text/javascript"
  src="https://widget01.wolkvox.com/chat/?prodId={id}&txt1={name}&txt2={phone}&txt3={email}&txt4={id}&txt5={extra_field}&txt6={comment}"
  async=""></script>
<!-- END CHATBOX WOLKVOX -->

What this means:

• {id} = The actual prodId copied from the “Integration Script.”
• txt1…txt6 = Values that travel as customer data (name, phone, email, etc.).
  • The exact mapping of what each txt# represents depends on how you have defined the chat/form fields (if your operation uses txt1 for “Name,” that’s fine; if it uses it for another field, you must respect that order).

Encode each value in Base64 (mandatory):

Before inserting them into the script, convert each value to Base64.

Quick Example in JavaScript (Browser)

// Safe Base64 for texts with accents/UTF-8
function toBase64(str) {
  return btoa(unescape(encodeURIComponent(str)));
}

const name = toBase64("María Gómez");
const phone = toBase64("573001112233");
const email = toBase64("maria@empresa.com");
const id = toBase64("CC123456789");
const extraField = toBase64("Premium Plan");
const comment = toBase64("Coming from the billing section");

Then, build the src with these already encoded values.

Insert the Script into Your Site (HTML)

Final example (with illustrative values; replace with your own Base64-encoded values): 

<script id="prodId" type="text/javascript"
  src="https://widget01.wolkvox.com/chat/?prodId=a1a1a1a1&txt1=TWFyw61hIEfDs21leg==&txt2=NTczMDAxMTEyMjMz&txt3=bWFyaWFAZW1wcmVzYS5jb20=&txt4=Q0MxMjM0NTY3ODk=&txt5=UGxhbiBQcmVtaXVt&txt6=VmluZ28gZGVzZGUgbGEgc2VjY2nDs24gZGUgZmFjdHVyYWNpw7Nu"
  async=""></script>