Publish HTML from ChatGPT on a Static Host

From ChatGPT code to a live link

ChatGPT can help create small websites, reports, demos, charts, landing pages and client review packets. The output often starts as one HTML file. Then it grows into a folder with CSS, JavaScript, images, CSV data and PDFs.

A preview in the chat is not a website that other people can open. This tutorial shows how to turn the generated code into a folder and test it. Then it shows how to publish the folder on a static host such as Netlify or Cloudflare Pages. A static host serves finished files and runs no server code. Last, the tutorial shows how to update the site and keep the same link.

When this workflow fits

Use it when ChatGPT creates:

• A static index.html page
• A mini landing page
• A product or proposal mockup
• A data report with charts
• A document comparison summary
• A small dashboard
• A client review packet with HTML, images and PDFs

If the project becomes a maintained app, use a developer hosting platform instead. Such an app has build commands, backend code, environment variables and a production pipeline. A static host cannot run server code. Also, a page that calls the OpenAI API with a secret key in the browser exposes that key to every visitor.

1. Ask ChatGPT for a folder, not only a snippet

A folder is easier to publish and update than loose code blocks. Here is an example prompt:

Create a static HTML review page for this project.

Return the files as a small folder structure:
- index.html
- styles.css
- app.js if JavaScript is needed
- README.md explaining the files
- data/sample.csv if you create structured data

Use relative paths only.
Do not reference local files from my computer.
Do not include secrets, API keys, or private customer data.
If you can, give me the folder as a downloadable .zip file.

If ChatGPT returns a .zip, unzip it. If it returns code blocks, create each file yourself. Use exactly the names and folders that ChatGPT used. Paste the code into each file.

A plain text editor works. Save each file with UTF-8 encoding. Keep the .html, .css and .js extensions.

2. Check the generated files locally

Before you publish, open the folder. Make sure that:

• index.html exists at the top level.
• CSS and JavaScript paths are relative (styles.css, not /Users/name/project/styles.css).
• Images load.
• Links to pages, PDFs and data files work.
• The folder has no .env files, secrets or tokens.
• Sample data is safe to share.
• Every form points to a real service. Remove any form that does not.

For a simple page, a double-click on index.html can be enough. Some pages load scripts as modules or fetch data files. Browsers can block these actions when the page opens from a local file. In that case, serve the folder with a small local server. If Python is installed, run this command inside the folder:

python3 -m http.server 8000

Then open http://localhost:8000 in your browser.

3. Organize the folder for reviewers

A clean review folder can look like this:

chatgpt-review-site/
  index.html
  styles.css
  app.js
  README.md
  data/
    summary.csv
  docs/
    source-notes.pdf
  assets/
    chart.webp

Keep the homepage at index.html. Use clear names for data and documents. Delete drafts and internal notes before you upload the folder, not after. A static host serves every file in the folder to anyone with the URL.

Browsers open PDFs directly. But CSV and Markdown files often download or show as plain text. Ask ChatGPT to link each document from index.html, with one line about its content. Also ask it to put everything that reviewers must read in the page itself.

4. Upload the folder to a static host

Both of these hosts accept a finished folder without Git.

On Netlify, log in. Then drag the folder onto Netlify Drop. You can also use the drag-and-drop area at the bottom of the Projects page of your team. Netlify publishes the folder and gives you a .netlify.app address (Netlify deploy docs).

On Cloudflare Pages, open Workers & Pages in the Cloudflare dashboard. Select Create application > Get started > Drag and drop your files. Name the project. Drag in the folder. Select Deploy site. The project name becomes part of the <project>.pages.dev address (Direct Upload docs).

On both hosts, upload the folder that contains index.html, not a parent folder around it. One extra level of nesting is the most common reason for a blank page or a 404 at the root address.

For a fuller walkthrough of each host, see our guides for Netlify and publishing without Git on Cloudflare Pages.

5. Choose who can open it

Decide this before you send the link:

• A public link suits examples, demos and open documentation.
• A shared password suits a client review. Netlify offers this on Pro and Enterprise plans (password protection). See our Netlify password guide.
• An email code for each person suits a review where you must know who can get in. With it, you can also remove one reviewer later. Put Cloudflare Access in front of a Pages site. List the allowed addresses. Each visitor receives a one-time PIN by email (one-time PIN). The steps are in Cloudflare Pages with Access.
• A custom domain suits a page that needs a branded address. Both hosts support one.

Do not rely on a password box that ChatGPT writes into the page’s JavaScript. The browser downloads the protected content with the script. Anyone can read that content in the page source.

6. Test, then share

After you publish the site:

1. Open the live URL yourself.
2. Test it in a private browser window while you are signed out of the host.
3. Make sure that images, links, PDFs and the small-screen layout work.
4. Open a direct link to one document, not only the homepage. If the site is protected, that link must ask for access too.
5. Send the link to reviewers.

Example: document comparison packet

For example, ChatGPT compares two policy drafts and creates these files:

policy-comparison/
  index.html
  comparison-summary.md
  data/change-log.csv
  docs/original.pdf
  docs/revised.pdf

On a static host, reviewers see index.html first. Ask ChatGPT to put the comparison summary into that page as HTML. Also ask it to show the change log as a table and to link both PDFs. The PDFs open in the browser. The CSV stays available for anyone who wants the raw data.

Because the PDFs are full drafts, this packet usually needs protection. Publish it behind a password or an email-code policy. Before you send the link, test a direct PDF link in a private window.

Update without changing the link

After the first release, keep one copy of the folder on your computer as the source. When something must change, do these steps:

1. Paste the current file back into ChatGPT, or attach it. Describe the change.
2. Ask for the complete updated file, not a fragment. Then nothing gets lost when you paste it.
3. Replace the file in your folder. Test the folder locally.
4. Redeploy to the same project. On Netlify, open the Deploys page of the project. Drag the folder onto the drop zone at the bottom of the page. On Cloudflare Pages, open the project. Select Create a new deployment.
5. Open the same link in a private window. Make sure that the change is live.

The address stays the same. Reviewers continue to use the link that they already have. Both hosts keep earlier deployments. If an update breaks something, you can roll back.

ChatGPT writes the HTML. The host makes it reachable. Your tests between these two steps make it safe to share.

Free email addresses
for your AI agents

Each agent gets an address like myagent.x7k2@revdokumail.com. It can receive emails, send replies and store files.

• 3 free mailboxes, each with its own address
• 3,000 incoming and 500 sent emails a month
• 3 GB of storage for attachments and files
• Virus, malware, spam and prompt-injection filter
• Read and reply through API, MCP or CLI

Create free mailbox

You do not need a card.