Developer Docs

Touchpoint Setup

Quick Start

Touchpoint UI provides a customizable chat interface that you can embed in your web applications. Touchpoint UI allows users to interact with your application and provides a seamless conversational experience.

You can try your applications directly on this configuration page. Then you can copy the code snippet to your HTML file.

Setup

In order for the application communication to work with NLX (i.e., not trigger CORS errors), make sure that the URL of your webpage is added to the whitelisted URL list of your API channel in Dialog Studio.

Theme

Setup snippet

1<html lang="en">
2  <head>
3    <title>Touchpoint Sample HTML</title>
4    <meta name="viewport" content="width=device-width, initial-scale=1">
5  </head>
6  <body>
7    <script type="module">
8      import { create, React, html } from "https://unpkg.com/@nlxai/touchpoint-ui@1.1.3/lib/index.js?module";
9      
10      create({
11        config: {
12          applicationUrl: "REPLACE_WITH_APPLICATION_URL",
13          headers: {
14            "nlx-api-key": "REPLACE_WITH_API_KEY"
15          },
16          languageCode: "en-US",
17          userId: "REPLACE_WITH_USER_ID"
18        },
19        colorMode: "dark",
20        input: "text",
21        theme: {"fontFamily":"\"Neue Haas Grotesk\", sans-serif","accent":"#AECAFF"},
22      });
23      
24    </script>
25  </body>
26</html>
Next
Touchpoint Setup: Configuration