Touchpoint
Try live
You can try your applications directly on this configuration widget.
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<!-- Touchpoint sample HTML --> 2<!-- Downloaded from https://developers.nlx.ai --> 3<html lang="en"> 4 <head> 5 <title>Touchpoint Sample HTML</title> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 </head> 8 <body> 9 <script defer src="https://unpkg.com/@nlxai/touchpoint-ui/lib/index.umd.js"></script> 10 <script> 11 const contentLoaded = () => { 12 if (document.readyState === "loading") { 13 return new Promise((resolve) => { 14 window.addEventListener("DOMContentLoaded", () => { 15 resolve(); 16 }); 17 }); 18 } else { 19 return Promise.resolve(); 20 } 21 }; 22 contentLoaded().then(() => { 23 return nlxai.touchpointUi.create({ 24 config: { 25 applicationUrl: "REPLACE_WITH_APPLICATION_URL", 26 headers: { 27 "nlx-api-key": "REPLACE_WITH_API_KEY" 28 }, 29 languageCode: "en-US" 30 }, 31 theme: {"fontFamily":"\"Neue Haas Grotesk\", sans-serif","accent":"#AECAFF"} 32 }) 33 }); 34 </script> 35 </body> 36</html>