back
React integration
React integration
Here's a step-by-step guide on how to add the LouiseBot script to the header section of the index.html file in a React.js project.
1
Open your React.js project in your preferred code editor.
2
In your project, locate the 'public' folder and open it.
LouiseBot_img_0
3
Inside the 'public' folder, find the 'index.html' file and open it.
LouiseBot_img_0
4
In the 'index.html' file, you will see a basic HTML structure. Locate the <head> tag in this file.
LouiseBot_img_0
5
Copy your chatbot script from LouiseBot dashboard.
LouiseBot_img_0
6
In the header of the page, paste the provided chatbot LouiseBot script.
LouiseBot_img_0
7
After pasting the LouiseBot script, save the changes made to the 'index.html' file.
8
Your LouiseBot script is now added to your ReactJS project . After your deployment in your server, return in the Settings menu of LouiseBot's dashboard, activate the 'Auto-install' option, or enter the domain name of the site that will use the chatbot.
LouiseBot_img_0
9
Your LouiseBot script is now added to your React.js project. When you run your application, the chatbot will be loaded on your page.
LouiseBot_img_0

By following these simple steps, you can easily integrate your LouiseBot script into your ReactJS application. If you encounter any issues or have further questions, don't hesitate to reach out to our support team for assistance.