How to add your chatbot to WordPress website
Adding a ChatLab chat feature to your website site can improve user engagement by facilitating direct conversations between your visitors and either you or your support team. There are two ways to add ChatLab to your website: using the WordPress plugin or manually embedding the chatbot script.
Method 1: Using the ChatLab WordPress Plugin (Recommended)
The easiest way to add ChatLab to your WordPress site is by using our dedicated WordPress plugin. This method ensures seamless integration without needing to modify any code manually.
Steps to Install the Plugin:
- Install the Plugin: Download and install the ChatLab Chatbot plugin from the WordPress plugin repository or by uploading the plugin files to your server. Plugin name is “ChatLab – AI Chatbot for your website – GPT-powered Customer & Sales Assistant”
- Activate the Plugin: Activate the plugin through the ‘Plugins’ menu in WordPress.
- Create a ChatLab Account:: Sign up for an account at ChatLab.com and create your chatbot. Train the chatbot using your website, files, or manual corrections.
- Obtain Your API Key: Once your chatbot is ready, copy the API key from your ChatLab dashboard.
- Configure the Plugin: Navigate to the plugin’s settings page in your WordPress admin panel and paste the API key into the configuration field.
- Test Integration: After saving your settings, verify the integration by checking if the chatbot chat window is visible on your website.
This approach is the most efficient way to integrate ChatLab, as it handles all the technical aspects for you.
Method 2: Manual Integration (Alternative Approach)
If you prefer manual integration, you can embed the chatbot directly into your WordPress site by inserting a script snippet.
Steps to Manually Add ChatLab:
Obtain code snippet
Log in to ChatLab, select the chatbot that you will embed and click on it
- Click on “Add to website”
- Choose between widget and iframe
- Click “Copy to clipboard”
Adding the code to your WordPress website
- Install and activate the "Insert Headers and Footers" plugin.
- Go to Settings > Insert Headers and Footers.
- Add your JavaScript code to the Header section and save.