Table of Contents
- Key takeaways
- Can you embed ChatGPT in a website?
- Why an iframe of ChatGPT does not work
- Why a custom GPT link is not an embed
- 3 ways to embed ChatGPT in your website
- Route 1: Embed ChatGPT with the OpenAI API
- Steps
- Cost
- Limits
- Who it fits
- Route 2: Embed a no-code chatbot trained on your content
- Steps
- Embed options
- Cost
- Limits
- Who it fits
- Route 3: Embed a chat with OpenAI ChatKit
- Steps
- Cost
- Limits
- Who it fits
- How much does it cost to embed ChatGPT in a website?
- How to choose between the three routes
- Where the embed code goes on WordPress, Shopify, Wix, Squarespace, and Webflow
- Common mistakes when embedding ChatGPT in a website
- Frequently asked questions
- Basics
- Can you embed ChatGPT in a website?
- Can you use ChatGPT on your website?
- Can you put ChatGPT in an iframe?
- Is a ChatGPT chatbot for a website the same as ChatGPT?
- Setup
- How do you add ChatGPT to a website without coding?
- Where does the chatbot embed code go?
- How do you add ChatGPT to a WordPress site?
- Can an embedded chatbot answer from your own content?
- Cost and models
- How much does it cost to add ChatGPT to a website?
- Is it free to embed ChatGPT in a website?
- Which OpenAI model should a website chatbot use?
- Is OpenAI ChatKit free?
- Sources
Created by
Do not index
Created time
Jul 23, 2025 01:04 PM
You cannot embed the ChatGPT app itself in a website, so you embed a chat that runs on an OpenAI model instead, using the OpenAI API, a no-code chatbot platform, or OpenAI ChatKit.
TL;DR
- The ChatGPT site cannot be loaded in an iframe. It sends the X-Frame-Options: SAMEORIGIN header, and browsers block it on other domains.
- Three routes work: the OpenAI API with your own chat window, a no-code chatbot trained on your content, and OpenAI ChatKit.
- The API is the cheapest per answer. 10,000 answers a month cost about $29.50 on gpt-6-luna with file search, before developer time and hosting.
- A no-code chatbot is the fastest route. SiteGPT installs with one script tag and starts at $59 a month billed monthly, or $39 a month billed yearly.
- A custom GPT link is not an embed. It opens inside ChatGPT, and OpenAI plans to retire custom GPTs.
Key takeaways
Question | Short answer |
Can you embed ChatGPT in a website? | Not the ChatGPT app. You can embed a chat that runs on the same OpenAI models |
Can you put ChatGPT in an iframe? | No. The ChatGPT site blocks framing on other domains |
Best route for developers who want full control | The OpenAI Responses API with your own chat window |
Best route for a customer service chatbot with no developer | A no-code chatbot such as SiteGPT, installed with one script tag |
Best route for developers who want a ready-made chat window | OpenAI ChatKit on your own server |
Lowest cost at 10,000 messages a month | The API at about $29.50, before developer time and hosting |
Can you embed ChatGPT in a website?
You cannot embed ChatGPT itself in a website, but you can embed a chat that runs on an OpenAI model. ChatGPT is OpenAI's own chat app, and its site blocks framing on other domains.
Two shortcuts fail for different reasons.
Why an iframe of ChatGPT does not work
An iframe of ChatGPT does not work because the ChatGPT site tells browsers to block it. The site sends the header X-Frame-Options: SAMEORIGIN. Its content security policy also limits frame-ancestors to the site itself.
A browser that sees those headers refuses to draw the page inside a frame on another domain. The visitor sees an empty box.
Why a custom GPT link is not an embed
A custom GPT link is not an embed because the GPT lives inside ChatGPT. A visitor who clicks the link leaves your site and continues the chat in ChatGPT.
Custom GPTs have two more limits:
- Personal accounts on Free, Go, Plus, and Pro cannot create or publish new GPTs. Creation needs a Business, Enterprise, or Edu workspace. A Business Standard seat costs $25 per user a month billed monthly, or $20 per user a month billed annually.
- OpenAI plans to retire custom GPTs. The planned date for affected Enterprise workspaces is December 11, 2026, and OpenAI expects other plans to follow the same timeline.
A GPT still suits a team that already works inside ChatGPT. The guide on how to train ChatGPT on your own data covers GPTs and ChatGPT projects in detail.
3 ways to embed ChatGPT in your website
There are three ways to embed a ChatGPT-style chat in your website. Each one puts an OpenAI model behind a chat window on your own pages.
The three routes are compared on four criteria:
- Who builds it. A developer, or anyone who can paste a script.
- Where the answers come from. The model alone, or your own content.
- How it is priced. Per token, or a flat monthly plan.
- What you maintain. A server and a chat window, or nothing.
No route is best overall. Each one has a "best for" label.
Route | Best for | Needs code | Needs your own server | Price to start |
1. OpenAI API with your own chat window | Developers who want full control | Yes | Yes | Usage-based. gpt-6-luna costs $0.10 input and $0.50 output per 1M tokens |
2. No-code chatbot (SiteGPT) | A customer service chatbot with no developer | No | No | $59 a month billed monthly, or $39 a month billed yearly. No free plan |
3. OpenAI ChatKit | Developers who want a ready-made chat window | Yes | Yes, for new builds | Usage-based, at the same model rates as route 1 |
Route 1: Embed ChatGPT with the OpenAI API
Best for: developers who want full control.
Embedding ChatGPT with the OpenAI API means building your own chat window and sending each message to an OpenAI model from your server. OpenAI's current flagship models are GPT-6 Astra, GPT-6.1 Sol, and GPT-6 Luna. OpenAI recommends GPT-6 Luna for cost-sensitive, high-volume workloads, and a website chat is one.
Steps
- Create an OpenAI API key in the OpenAI dashboard.
- Store the key on your server as an environment variable. OpenAI's key safety guide says never to deploy a key in browsers or mobile apps.
- Create a vector store and upload your help content to it. The file search tool lets the model search those files before it answers.
- Write a server endpoint that receives the visitor's message and calls the Responses API.
- Build the chat window in HTML and JavaScript. The window posts each message to your endpoint and shows the reply.
- Add what a bare API does not give you: rate limits, chat history, and a way to reach a person.
The server call looks like this:
import OpenAI from "openai";
const client = new OpenAI();
const response = await client.responses.create({
model: "gpt-6-luna",
input: visitorMessage,
tools: [{ type: "file_search", vector_store_ids: ["<vector_store_id>"] }],
});
return response.output_text;The response carries the answer and the file citations behind it.
Cost
The API bills by usage. gpt-6-luna costs $0.10 per 1M input tokens and $0.50 per 1M output tokens. File search costs $2.50 per 1,000 tool calls. File storage costs $0.10 per GB per day, and the first GB is free.
Worked example. Assume each answer makes one file search call and uses 3,000 input tokens and 300 output tokens. Storage stays under the free 1 GB.
Cost line | Per 1,000 answers | At 10,000 answers a month |
Input tokens at $0.10 per 1M | $0.30 | $3.00 |
Output tokens at $0.50 per 1M | $0.15 | $1.50 |
File search calls at $2.50 per 1,000 | $2.50 | $25.00 |
Total | $2.95 | $29.50 |
File search is 85% of the bill in this example. The token counts are assumptions, and the totals leave out developer time, hosting, and the chat window.
Limits
- It needs a server. A page that calls OpenAI straight from the browser exposes the API key to every visitor.
- There is no widget, dashboard, or handoff to a person unless you build them.
- Older tutorials use the Assistants API. OpenAI shut it down on August 26, 2026 and points developers to the Responses API.
- Keeping the uploaded files current is your job.
Who it fits
The API fits a team with developers that wants the chat inside its own product or design system. If your code still calls a GPT-3 or GPT-3.5 model, read what a GPT-3 chatbot means today first. The guide to a custom AI chatbot covers the build-or-buy trade-offs.
Route 2: Embed a no-code chatbot trained on your content
Best for: a customer service chatbot with no developer.
A no-code chatbot platform runs the OpenAI model, the retrieval, and the chat window for you. You add your content, copy one script, and paste it into your site. Visitors chat in a widget on your pages.
SiteGPT is the worked example here. Its pricing page names the OpenAI models it runs: GPT-4.1-mini and GPT-4.1.
Steps
- Sign in with your email address and start the 7-day trial. The trial requires a credit card.
- Select Create New Chatbot and name it.
- Add your content. Sources include website URLs, sitemaps, uploaded files, YouTube, Google Drive, Dropbox, OneDrive, Box, Notion, and GitHub.
- Wait for training, then test the chatbot with three or four questions your visitors often ask.
- Open Installation and copy the code under JavaScript Embed.
- Paste the code into your site and publish.
- Open your site in a private browser window. The chat icon appears in the bottom corner after a short delay.
The embed code looks like this, with your own chatbot ID in place of the placeholder:
<script type="text/javascript">window.$sitegpt=[];(function(){d=document;s=d.createElement("script");s.src="https://sitegpt.ai/widget/YOUR_CHATBOT_ID.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>The SiteGPT install guide says the code can go in the head section or just before the closing body tag. The script loads in the background. Copy the code from your own Installation page, because it already carries your chatbot ID.
The full walkthrough with screenshots is in how to create an AI chatbot.
Embed options
The script URL accepts options that change how the chat appears.
Option | What it does |
open=true | Opens the chat when the page loads |
mobile=false | Hides the chat icon on screens narrower than 640 px |
delay=5000 | Waits 5 seconds before adding the chat icon. The default is 2 seconds |
iconPosition=LEFT | Puts the chat icon on the left |
hideBubble=true | Removes the floating chat, for use with a chat placed inside the page |
Every chatbot also has a hosted chat page. That link works when there is no website to add the widget to.
Cost
SiteGPT plan | Billed monthly | Billed yearly | Messages a month | Chatbots |
Starter | $59 a month | $39 a month ($468 a year) | 4,000 GPT-4.1-mini or 400 GPT-4.1 | 1 |
Growth | $129 a month | $79 a month ($948 a year) | 10,000 GPT-4.1-mini or 1,000 GPT-4.1 | 2 |
Scale | $429 a month | $259 a month ($3,108 a year) | 40,000 GPT-4.1-mini or 4,000 GPT-4.1 | 3 |
Yearly billing on Starter costs $468 a year. Monthly billing costs $708 a year. Yearly billing saves $240, or 34%.
Limits
- There is no free plan. The 7-day trial needs a credit card.
- Message quotas are fixed per plan. A GPT-4.1 message uses 10 times the quota of a GPT-4.1-mini message.
- Starter has no chat integrations, no API access, and manual content refresh only.
- Removing SiteGPT branding is a paid add-on at $39 a month billed yearly.
- There is no Intercom or HubSpot integration today.
- The chat icon does not show if the site's domain is missing from the chatbot's Allowed Domains list, or if a strict content security policy blocks the script.
Who it fits
A no-code chatbot fits a business that wants answers from its own pages on its own site and has nobody to build and host a chat. The comparison of AI chatbots for a website covers other platforms in this category. If the budget is zero, see the free chatbots for a website.
Route 3: Embed a chat with OpenAI ChatKit
Best for: developers who want a ready-made chat window.
OpenAI ChatKit is an embeddable chat interface from OpenAI. It supplies the chat window, file attachments, and widgets. You supply the server and the agent logic behind it.
ChatKit has two paths. New builds use the custom server path. The hosted path only serves teams that already have an Agent Builder workflow, and OpenAI has scheduled Agent Builder to shut down on November 30, 2026. OpenAI's deprecations page says ChatKit remains available.
Steps
- Install the ChatKit server package with
pip install openai-chatkit.
- Implement a ChatKit server class that responds to each visitor message. OpenAI's guide connects it to the Agents SDK.
- Expose an HTTP endpoint that forwards requests to that server.
- Implement a data store for threads and messages. Use durable storage in production.
- Add the ChatKit script to your page and render the chat with the ChatKit JS or React bindings.
- Authenticate your users on the server. OpenAI's hosted path requires a unique user identifier for every session.
Cost
ChatKit usage is billed through the API. Model tokens and tools cost the same as in route 1. OpenAI's pricing page lists one ChatKit line: file and image upload storage at $0.10 per GB per day, after 1 GB free per account each month.
Limits
- It needs a server, a data store, and user authentication.
- It gives you a chat window, and the content retrieval is still yours to build.
- Hosted Agent Builder workflows stop on November 30, 2026.
- There is no dashboard for non-developers and no built-in handoff to a person.
Who it fits
ChatKit fits a product team that wants OpenAI's chat interface inside its own app and already runs server code. A team with no developer should use route 2.
How much does it cost to embed ChatGPT in a website?
Embedding ChatGPT in a website costs about $2.95 per 1,000 answers through the OpenAI API, or a flat $59 to $429 a month on a no-code plan billed monthly. The table uses the API assumptions from route 1 and the SiteGPT quotas as published.
Messages a month | OpenAI API on gpt-6-luna | SiteGPT plan with that quota | SiteGPT, billed monthly | SiteGPT, billed yearly |
4,000 | $11.80 | Starter | $59 a month | $39 a month |
10,000 | $29.50 | Growth | $129 a month | $79 a month |
40,000 | $118.00 | Scale | $429 a month | $259 a month |
At 10,000 messages a month, the API costs $29.50 and the Growth plan costs $79 a month billed yearly. The difference is $49.50 a month, or $594 a year. Against monthly billing, the difference is $99.50 a month.
That difference pays for the parts the API leaves to you: the chat window, hosting, content crawling, the dashboard, and handoff to a person. Developer time is the largest cost the API column leaves out.
Two notes apply to the comparison. SiteGPT counts messages by its own quota rules, so read each row as the price at that published quota. The SiteGPT quotas are for GPT-4.1-mini messages, and GPT-4.1 messages use 10 times the quota.
ChatKit sits with the API column. It uses the same model rates and adds your own server costs.
How to choose between the three routes
Choose between the three routes by asking who will build and maintain the chat. That one answer rules out most of the list.
If you need... | Pick... | Why |
A chatbot on your site this week, with no developer | Route 2: a no-code chatbot | Install is one script tag, and the platform hosts everything |
Answers from your own pages, files, and videos | Route 2: a no-code chatbot | The platform crawls and indexes the content for you |
The chat inside your own product, in your own design | Route 1: the OpenAI API | You control the interface, the model, and the data flow |
The newest OpenAI model on day one | Route 1: the OpenAI API | You set the model ID yourself |
The lowest cost per answer at high volume | Route 1: the OpenAI API | About $118 for 40,000 answers in the worked example, before developer time |
A polished chat window without designing one | Route 3: ChatKit | OpenAI supplies the interface, and you supply the server |
Handoff to a person on your team | Route 2: a no-code chatbot | Routes 1 and 3 have no handoff unless you build one |
An assistant for your own team inside ChatGPT | A ChatGPT project or custom GPT | Nothing needs to be embedded |
Where the embed code goes on WordPress, Shopify, Wix, Squarespace, and Webflow
The embed code goes in the site-wide custom code area of your website builder, so the chat loads on every page. This applies to route 2 and to any script-based chat.
The rule is the same on every platform. Code placed on one page shows the chat on that page only. Code placed in a shared layout, theme file, or site-wide setting shows it everywhere.
The SiteGPT install guide has separate steps for plain HTML, WordPress, Shopify, Squarespace, Wix, and Webflow. WordPress sites can also use the SiteGPT plugin instead of pasting code. If you want a WordPress chatbot that costs nothing to run, compare the free plugins in the free WordPress chatbot guide first.
Platform guides cover the details:
- WordPress: how to add a chatbot to WordPress
- Wix: AI chatbots for Wix
- Squarespace: chatbots for Squarespace
- Webflow: AI chatbots for Webflow
Common mistakes when embedding ChatGPT in a website
The most common mistakes come from treating ChatGPT as a widget. Six show up often.
- Putting the ChatGPT site in an iframe. The browser blocks it. Use one of the three routes.
- Calling OpenAI from browser JavaScript. The API key becomes visible to every visitor. Route every request through your own server.
- Following an Assistants API tutorial. OpenAI shut that API down on August 26, 2026. Use the Responses API.
- Starting a new build on Agent Builder. It shuts down on November 30, 2026. New ChatKit builds use your own server.
- Sending customers to a custom GPT. The chat happens inside ChatGPT, and OpenAI plans to retire the feature.
- Launching without your own content. A bare model knows nothing about your prices or policies. Connect it to your pages and tell it to decline when the content has no answer. Chatbot hallucinations covers the other guardrails.
For a narrow first project, start with an AI FAQ chatbot. The launch checklist is in chatbot best practices.
Frequently asked questions
Basics
Can you embed ChatGPT in a website?
You cannot embed the ChatGPT app. You can embed a chat that runs on an OpenAI model through the OpenAI API, a no-code chatbot platform, or OpenAI ChatKit.
Can you use ChatGPT on your website?
Yes, through the OpenAI API or a platform built on it. The chat on your site uses the same family of models. The ChatGPT app itself stays on OpenAI's site.
Can you put ChatGPT in an iframe?
No. The ChatGPT site sends the X-Frame-Options: SAMEORIGIN header, so browsers refuse to load it in a frame on another domain.
Is a ChatGPT chatbot for a website the same as ChatGPT?
No. ChatGPT is OpenAI's chat app. A website chatbot is a separate chat window that sends messages to an OpenAI model and usually answers from your own content.
Setup
How do you add ChatGPT to a website without coding?
Use a no-code chatbot platform. You add your content, copy one script, and paste it into your site's custom code setting.
Where does the chatbot embed code go?
The SiteGPT embed code goes in the head section or just before the closing body tag. Place it in a shared layout or a site-wide setting so the chat appears on every page.
How do you add ChatGPT to a WordPress site?
Paste a chatbot embed script into the site-wide code area, or install a chatbot plugin. The WordPress chatbot comparison lists the plugin options.
Can an embedded chatbot answer from your own content?
Yes. The API uses the file search tool over files you upload. A no-code platform indexes your pages and files. What is RAG explains how retrieval works.
Cost and models
How much does it cost to add ChatGPT to a website?
The OpenAI API costs about $29.50 a month for 10,000 answers on gpt-6-luna in the worked example above. SiteGPT starts at $59 a month billed monthly, or $39 a month billed yearly.
Is it free to embed ChatGPT in a website?
No. The OpenAI API bills per token, and SiteGPT has no free plan. Its 7-day trial requires a credit card.
Which OpenAI model should a website chatbot use?
OpenAI recommends GPT-6 Luna for cost-sensitive, high-volume workloads and GPT-6.1 Sol for a balance of intelligence and cost. A no-code platform sets the model for you. SiteGPT runs GPT-4.1-mini and GPT-4.1.
Is OpenAI ChatKit free?
ChatKit has no separate usage fee on OpenAI's pricing page apart from upload storage. Model tokens and tools are billed at API rates, and you pay for your own server.
Sources
All sources were checked on October 8, 2026.
- ChatGPT response headers
