This guide explains how to connect your website to AI Suite for Website, embed the deployment code, and enable features such as the AI chatbot and leads management.
What you will accomplish
By the end of this guide, you will:
Connect your website to AI Suite for Website and embed the JavaScript deployment code.
Enable the AI chatbot to provide visitors with instant support.
Enable the leads management feature to collect potential customer information using a lead generation form.
Prerequisites
You have a publicly accessible website.
You have permission to add JavaScript code to your website's HTML.
Step 1: Add your website
Sign in to the Alibaba Cloud Domains console.
In the left-side navigation pane, select AI Suite for Website.
Click Add website.
In the dialog box that appears, enter your website address (for example,
https://www.example.com), and then click OK.Wait for the system to crawl and initialize your website. This typically takes 1 to 3 minutes. After initialization, the system automatically redirects you to the management console for the website instance.
The website crawler starts from the URL you provide and traverses links up to three levels deep. To prevent initialization failure, ensure your website is publicly accessible.
If initialization takes longer than five minutes, verify that your website is accessible.
Step 2: Deploy the code
Embed a JavaScript code snippet into your website's HTML to enable AI Suite for Website.
In the left-side navigation pane of the instance management console, click Deployment and preview.
In the Get code section, copy the JavaScript code snippet displayed on the page.
Paste the copied code inside the
<head>tag of your website's pages. This ensures the script executes early as the page loads.
For instructions on how to embed the code in popular website builders like WordPress, Shopify, Wix, WooCommerce, and Shopline, see Embed JavaScript code in a website.
The deployment code must be embedded on every page of your website where you want to enable AI features. If you use a template engine or a Content Management System (CMS), you can add the code to a global template.
Step 3: Verify deployment and enable features
After you embed the code, return to the Deployment and preview page to verify the deployment status and enable the features you need.
In the Get code section on the Deployment and preview page, check the deployment status.
Embedded: The code is deployed correctly.
Not embedded: The code is not deployed. Verify that you have pasted the code correctly and published the changes to your live site.
NoteIf the status remains Not embedded, ensure the code is in the correct location and you have published the changes to your live site. Then, clear your browser cache and refresh the page.
After the status shows Embedded, turn on the Activate features switch.
In the Feature switches section, enable the features you need:
Feature
Description
AI chatbot
Provides 24/7 support to answer visitor questions.
Leads management
Helps you capture leads by encouraging visitors to submit their information.
Website renovation (coming soon)
Renovate your website with AI, no coding required.
The Activate features switch is a global control. Turning it off pauses all AI features on your website. You will not lose your configurations or data.
Next steps
After enabling the features, you can configure them further:
AI chatbot: Customize the chatbot's appearance, opening questions, and knowledge base to improve the visitor experience.
Leads management: Configure lead generation forms, notification methods, and collection channels to capture potential customer information.