CustomGPT.ai tutorial

How to Add a Chatbot to Your Website in 2026 (Step-by-Step Guide)

Step-by-step guide to adding an AI chatbot to any website — tested with CustomGPT.ai. From account setup to embed code in under 20 minutes.

By Miriam Alonso · Updated May 2026 · 6 steps · ~18 min · Intermediate

Businesses that add a chatbot to their website typically see a 30–40% reduction in support ticket volume within the first 30 days — because the chatbot handles the questions that get asked dozens of times a day (pricing, hours, return policy, how-to questions) before they reach a human agent. But building a chatbot used to require weeks of developer time, complex integrations, and a large budget. In 2026, the process takes 15 minutes and requires no code.

This guide walks you through adding a custom AI chatbot to your website using CustomGPT.ai. You'll train the chatbot on your own content (website pages, PDFs, FAQs), customize the widget to match your brand, and copy-paste a single JavaScript snippet to deploy it live. No coding required. A 7-day free trial is available without a credit card.

According to G2's conversational AI platform reviews and Capterra's chatbot software ratings, hands-on testing is essential — user reviews confirm that setup complexity varies significantly between tools.

1

Step 1: Sign up for CustomGPT.ai and create an account

Go to customgpt.ai and click Start Free Trial. You can sign up with your Google account or create an account with your email address. The 7-day free trial gives you access to all features with no credit card required at signup. After the trial, plans start at $49/month for the Basic plan (which covers most small business websites).

Once you're in the dashboard, you'll see the Projects panel. This is where all your chatbot projects live. A project is a single chatbot instance trained on a specific set of data — you can create separate projects for different websites, departments, or use cases.

Tool used in this step: CustomGPT.ai

2

Step 2: Create a new chatbot project

Click Create New Project in the CustomGPT.ai dashboard. Give your project a name (e.g., "Website Support Bot" or "Product FAQ Assistant") — this is internal, visible only to you in the dashboard. Then set the chatbot's display name, which is what visitors see in the chat widget (e.g., "Aria" or "Support Assistant").

In the Persona and Instructions field, describe how the chatbot should behave: its role, the topics it should focus on, the tone it should use, and any restrictions. For example: "You are a helpful customer support assistant for Acme Software. Answer questions about our products, pricing, and onboarding process. If you don't know the answer, say so and offer to connect the customer with a human agent. Always be professional and concise." This system instruction shapes every response the chatbot gives.

Click Create Project to proceed to the data source configuration step.

Tool used in this step: CustomGPT.ai

3

Step 3: Upload your training data

This is the step that makes your chatbot smart about your specific business. CustomGPT.ai supports three main data source types: (1) Website URL/sitemap — paste your website URL or sitemap.xml URL and CustomGPT.ai automatically crawls and ingests all your pages; (2) File upload — upload PDFs, Word documents, Excel files, PowerPoint presentations, CSV files, or plain text files (CustomGPT.ai supports 1,400+ file formats); (3) Custom text — paste FAQ content, policy documents, or any structured text directly into the input field.

For most business websites, start with your website sitemap URL — this captures your product pages, pricing page, FAQ, and blog in one step. Then supplement with any PDFs you have: product brochures, user manuals, return policy documents, or pricing guides. The more relevant content you provide, the more accurately the chatbot will answer visitor questions.

Click Add Sources to submit your data sources. CustomGPT.ai queues the ingestion and processes your content — typically 2–5 minutes for a website with 50–200 pages. You'll see a progress indicator in the Sources panel.

Tool used in this step: CustomGPT.ai

4

Step 4: Wait for training to complete and test your chatbot

Once ingestion completes, CustomGPT.ai indexes your content using retrieval-augmented generation (RAG). Each question the chatbot receives is matched against your indexed content to generate accurate, source-grounded answers. The indexing step is automatic — you don't need to configure anything.

When the status indicator shows "Ready", click the Test Chatbot button in the dashboard. This opens a preview of the chat widget where you can ask your chatbot questions directly. Test with questions your real visitors commonly ask: "What is your return policy?", "How much does the Pro plan cost?", "Does this work on mobile?", "How do I reset my password?"

If the chatbot gives a vague or incorrect answer on a question where you have documentation, check whether the relevant page or document was successfully ingested (check the Sources panel for errors). You can add missing data sources and re-index at any time. Iterate on the Persona instructions to adjust tone and scope before deploying.

Tool used in this step: CustomGPT.ai

5

Step 5: Customize the chat widget appearance

In the CustomGPT.ai dashboard, go to Widget Settings for your project. Here you configure the visual appearance of the chat bubble and window that visitors see on your website. Key settings include: Widget color (match your brand's primary color using a hex code), Chat window header color, Chatbot avatar (upload your logo or a custom avatar image), Opening greeting message (the first message the chatbot sends when the widget opens — make it a question that invites engagement: "Hi! What can I help you with today?"), and Widget position (bottom-right is standard; bottom-left is available for sites where bottom-right conflicts with other UI elements).

You can also configure the Welcome screen — the view the visitor sees before starting a chat — with suggested questions that guide them toward the topics your chatbot handles best. For example: "What are your pricing plans?", "How do I get started?", "What integrations do you support?" These clickable suggestions reduce the cognitive load of starting a conversation and increase engagement rates.

Click Save and Preview to see your widget configuration rendered in a live preview panel. Adjust until the widget matches your site's brand and tone.

Tool used in this step: CustomGPT.ai

6

Step 6: Copy the embed code and add it to your website

In the CustomGPT.ai dashboard, go to Deploy > Embed Code for your project. You'll see a JavaScript snippet — a single script tag with a `src` pointing to the CustomGPT.ai widget loader and a `data-project-id` attribute for your specific project. Copy this snippet.

Paste the snippet into your website's HTML just before the closing `</body>` tag on every page where you want the chat widget to appear. For most sites, this means adding it to your global layout template or footer template so it loads sitewide. On WordPress, go to Appearance > Theme Editor > footer.php and paste just before `</body>`. On Shopify, go to Online Store > Themes > Edit Code > theme.liquid and paste before `</body>`. On Webflow, Squarespace, Wix, or any other website builder, look for a Custom Code or Footer Code section in your site settings and paste there.

After adding the snippet, reload your website in a fresh browser window and confirm the chat bubble appears in the corner. Click it to open the widget and run a test conversation. The widget is live — real visitors can now interact with your chatbot immediately.

Tool used in this step: CustomGPT.ai

The six-step process — create an account, set up your project, upload training data, test the chatbot, customize the widget, and add the embed code — takes 15 minutes from start to a live chatbot on your website. The chatbot is immediately useful to visitors from the first day because it's trained on your actual content, not generic responses. As you add or update content on your website, re-ingest the updated URLs to keep the chatbot's knowledge current.

CustomGPT.ai's trial is the lowest-friction way to test whether a chatbot delivers real value for your specific site. Most businesses see the first measurable impact — a reduction in repetitive support questions — within the first week. For ongoing management: check the Conversations panel in your dashboard weekly to review what visitors are asking and identify any content gaps (questions the chatbot couldn't answer well become your content roadmap).

Recommended tools

Frequently Asked Questions

How long does it take for the chatbot to finish training?

CustomGPT.ai typically completes content ingestion and indexing in 2–5 minutes for a standard business website (50–200 pages). Larger sites with 500+ pages may take 10–20 minutes. PDF and document uploads are usually processed in under 2 minutes regardless of file count. You can monitor progress in the Sources panel of your project dashboard — each source shows a status indicator (processing, ready, or error). You don't need to stay on the page while it processes; CustomGPT.ai sends an email notification when your chatbot is ready to test.

Can the chatbot handle multiple languages?

Yes — CustomGPT.ai supports 95+ languages. The chatbot automatically detects the language the visitor is writing in and responds in that language, even if your training content is only in English. For bilingual or multilingual sites, you can also upload training content in multiple languages to improve accuracy for specific locales. The language auto-detection works without any configuration — it is on by default. This makes CustomGPT.ai a practical choice for international websites or businesses serving multilingual customer bases.

What file types can I use to train the chatbot?

CustomGPT.ai supports 1,400+ file formats for training data. The most commonly used are: PDF (product brochures, manuals, policy documents), Word documents (.docx), PowerPoint presentations (.pptx), Excel files (.xlsx), plain text files (.txt), CSV files, and website URLs/sitemaps. You can also connect Google Drive folders and Notion pages as data sources on higher plans. The sitemap URL option is the fastest way to ingest a full website — paste your sitemap.xml URL and CustomGPT.ai automatically crawls all linked pages.

How do I update the chatbot when my website content changes?

When you update your website content, blog, or pricing, re-ingest the updated source in CustomGPT.ai to keep the chatbot current. Go to your project's Sources panel, find the website URL or document that changed, and click Re-ingest. CustomGPT.ai processes the updated content in 2–5 minutes and the chatbot immediately reflects the new information. For regularly updated sites (weekly blog posts, frequent pricing changes), set a recurring reminder to re-ingest monthly. CustomGPT.ai also supports automatic sitemap re-crawl on a schedule on the Business and Enterprise plans — this keeps content fresh without manual intervention.

Miriam Alonso

Miriam Alonso

CSM - 3 months testing

See all my reviews →